@charset "utf-8";

/* =======================================================
#row_01 #parts_main_visual
==========================================================*/
#parts_main_visual{
width:100%;
height:360px;
position:relative;
background:#000;
}
#main_visual_slide ul.list li{
width:100%;
position:absolute;
top:0;
left:0;
z-index:1;
}
#main_visual_slide ul.list li dl dt{
width:100%;
height:0;
min-height:250px;
overflow:hidden;
position:relative;
background:#000;
}
@media only screen and (max-width:320px){
#parts_main_visual{height:320px;}
#main_visual_slide ul.list li dl dt{min-height:210px;}
}
#main_visual_slide ul.list li dl dt img{
position:absolute;
top:50%;
left:50%;
-webkit-transform:translate(-50%,-50%);
-ms-transform:translate(-50%,-50%);
transform:translate(-50%,-50%);
width:100%;
height:auto;
}
#main_visual_slide ul.list li dl dd{
padding:10px 14px;
font-family: 'Roboto',sans-serif;
font-size:14px;
line-height:1.6em;
color:#f37;
}
#main_visual_slide ul.list li a.hover dl dt img{
opacity:0.9;filter:alpha(opacity=90);-ms-filter:"alpha(opacity=90)";
}
#main_visual_slide ul.list li a.hover dl dd{
text-decoration:underline;
}
/* #parts_main_visual p.logo
------------------------------ */
#parts_main_visual p.logo{
width:128px;
height:100px;
background:url(https://www.suntory.com/culture-sports/sungoliath/common/responsive/img/logo.png) no-repeat 0 0;
background-size:100% auto;
-moz-background-size:100% auto;
-webkit-background-size:100% auto;
position:absolute;
bottom:-80px;
right:0;
z-index:1;
}
@media only screen and (max-width:320px){
#parts_main_visual p.logo{width:110px;height:90px;}
}

/* =======================================================
#row_01 #parts_result
==========================================================*/
#parts_result{
background:#191919;
}
/* #parts_result .block
=================================================== */
#parts_result .block h2 em{
font-family:'Roboto',sans-serif;
font-weight:700;
padding:0 0.4em;
}
#parts_result .block h3{
text-align:center;
width:100%;
font-family: 'Roboto',sans-serif;
color:#d0d0d0;
}
#parts_result .block h3 em{
display:block;
padding:0.8em 5px 0.5em 5px;
font-weight:bold;
color:#fff;
letter-spacing:0.2px;
}
/* #parts_result .block table
-------------------------------- */
#parts_result .block table{
margin-top:5px;
width:100%;
overflow:hidden;
}
#parts_result .block table th,
#parts_result .block table td{
text-align:center;
vertical-align:middle;
color:#8d8d8d;
font-size:13px;
line-height:1.2em;
letter-spacing:-1px;
}
/* #parts_result .block#result_block
=================================================== */
#result_block{
padding:20px 10px 10px 10px;
}
#result_block h2 em{
font-size:24px;
color:#fb0;
}
#result_block h2 i{
font-size:13px;
color:#b96;
}
@media only screen and (max-width:320px){
#result_block h2 em{font-size:22px;}
#result_block{padding:20px 8px 8px 8px;}
}
#result_block h3{
margin-top:20px;
height:85px;
background-color:rgba(50,50,50,0.7);
font-size:13px;
line-height:1.6em;
}
#result_block h3 em{
font-size:15px;
}
#result_block table{
height:110px;
}
#result_block table th{
background-color:rgba(50,50,50,0.7);
width:26%;
}
#result_block table th img{
width:80%;
height:auto;
margin:5px auto;
}
#result_block table td dl{
display:table;
margin:0 auto;
width:100%;
}
#result_block table td dl dt,
#result_block table td dl dd{
display:table-cell;
vertical-align:middle;
text-align:center;
}
#result_block table td dl dt{
width:32%;
}
#result_block table td dl dt em,
#result_block table td dl dt i{
font-family:'Roboto',sans-serif;
font-weight:900;
font-size:35px;
}
#result_block table td dl dt em{
color:#fff;
}
#result_block table td dl dd p{
background-color:rgba(50,50,50,0.7);
border-radius:3px;
height:35px;
line-height:34px;
margin-bottom:3px;
font-size:10px;
display:table;
width:100%;
}
#result_block table td dl dd p span,
#result_block table td dl dd p i{
display:table-cell;
vertical-align:middle;
}
#result_block table td dl dd p i{
font-family:'Roboto',sans-serif;
font-weight:400;
font-size:13px;
color:#fff;
width:35%;
}
#result_block table td p.btn a{
display:block;
margin:0 auto;
font-size:14px;
letter-spacing:1px;
color:#000;
width:92%;
height:36px;
line-height:35px;
border-radius:3px;
text-align:center;
background:#febf0f;
background:-moz-linear-gradient(left,#febf0f 0%,#fed000 30%,#fed000 70%,#febf0f 100%);
background:-webkit-linear-gradient(left,#febf0f 0%,#fed000 30%,#fed000 70%,#febf0f 100%);
background:linear-gradient(to right,#febf0f 0%,#fed000 30%,#fed000 70%,#febf0f 100%);
}
#result_block table td p.btn a.hover{
background:#ff9900;
background:-moz-linear-gradient(left,#ff9900 0%,#ffbb00 30%,#ffbb00 70%,#ff9900 100%);
background:-webkit-linear-gradient(left,#ff9900 0%,#ffbb00 30%,#ffbb00 70%,#ff9900 100%);
background:linear-gradient(to right,#ff9900 0%,#ffbb00 30%,#ffbb00 70%,#ff9900 100%);
}
/* #parts_result .block#next_block
=================================================== */
#next_block{
padding:14px 10px 10px 10px;
background-color:rgba(50,50,50,0.8);
}
#next_block h2 {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
#next_block h2 em{
font-size:5.0666666666667vw;
font-family: 'Roboto',sans-serif;
color:#fff;
}
#next_block h2 a{
display:flex;
align-items: center;
height:9.3333333333333vw;
background:url(https://www.suntory.com/culture-sports/sungoliath/parts_data/result/to_result.png) no-repeat 3.6vw center #222;
background-size:5.4666666666667vw auto;
border-radius:25px;
font-size:3.2vw;
color:#fff;
line-height:31px;
padding:0 3.4666666666667vw 0 11.3333333333333vw;
}
#next_block h2 a.hover{
background-color:#393939;
}
#next_block h3{
height:70px;
background-color:rgba(90,90,90,0.5);
margin-top:10px;
font-size:12px;
line-height:1.4em;
}
#next_block h3 em{
font-size:14px;
}
#parts_result .block#next_block table th{
background-color:rgba(90,90,90,0.5);
height:60px;
width:38%;
font-size:11px;
color:#fff;
padding:0 0.4em;
}
/* #parts_result .block.none
=================================================== */
#parts_result .block.none h3,
#parts_result .block.none h3 em{
font-size:0 !important;
}
#parts_result .block.none h3:before{
content:"----年--月--日";
display:block;
padding-top:9.5%;
font-size:14px;
font-weight:bold;
color:#fff;
letter-spacing:2px;
}
#parts_result .block#result_block.none h3:before{
padding-top:11%;
}
#parts_result .block.none table th:last-child img{display:none;}
#parts_result .block.none table th:last-child{font-size:0 !important;}

#parts_result .block.none table td dl dt em,
#parts_result .block.none table td dl dt i,
#parts_result .block.none table td dl dd p i{
font-size:0 !important;
}
#parts_result .block.none table td dl dt em:before,
#parts_result .block.none table td dl dt i:before,
#parts_result .block.none table td dl dd p i:before{
content:"\00ff0d";
display:block;
font-size:14px;
color:#868686;
}
#parts_result .block.none table td p.btn a{
pointer-events:none;
background:#5c5c5c !important;
color:#a9a9a9 !important;
}
/* ==================================================================
#row_01 #parts_news
==================================================================== */
#parts_news{
padding:1.2em 1em;
background: #fff;
}
/* #parts_news header
-------------------------------------------------- */
#parts_news header {
    margin-bottom: 15px;
    display: flex;
    justify-content: space-between;
}
#parts_news header h2 em{
font-family:'Roboto',sans-serif;
font-weight:900;
font-size:30px;
color:#000;
}
#parts_news header h2 i{
font-size:14px;
padding-left:1.2em;
}
#parts_news header p.btn a{
display:block;
border-radius:15px;
font-size:12px;
letter-spacing:-1px;
color:#320;
width:90px;
height:30px;
line-height:29px;
text-align:center;
background:#febf0f;
background:-webkit-linear-gradient(left,#febf0f 0%,#fed000 30%,#fed000 70%,#febf0f 100%);
background:linear-gradient(to right,#febf0f 0%,#fed000 30%,#fed000 70%,#febf0f 100%);
}
/* #parts_news ul
-------------------------------------------------- */
#parts_news ul{
box-sizing:border-box;
}
#parts_news ul li{
    margin-bottom: 10px;
}
#parts_news ul li:last-child{
    margin-bottom: 0;
}
#parts_news ul li a {
    display: flex;
    align-items: center;
}
#parts_news ul li figure {
    margin: 0;
    padding: 0;
    overflow: hidden;
    width: 21.6vw;
    height: 20vw;
    position: relative;
}
#parts_news ul li figure img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: auto;
  height: 100%;
}
#parts_news ul li dl{
    display: flex;
    flex-direction: column;
    margin-left: 4vw;
}
#parts_news ul li dl dt{
margin-bottom: 2.6666666666667vw;
font-size:3.7333333333333vw;
line-height:1;
color:#222;
width: 130px;
}
#parts_news ul li dl dd{
font-size:3.7333333333333vw;
line-height:1.3em;
color:#222;
}

/* =======================================================
#row_01 #parts_schedule
========================================================= */
#parts_schedule{
padding:0 1em 2em 1em;
background:#ebebeb;
background:-moz-linear-gradient(top,#ebebeb 0%,#ebebeb 80%,#fefefe 100%);
background:-webkit-linear-gradient(top,#ebebeb 0%,#ebebeb 80%,#fefefe 100%);
background:linear-gradient(to bottom,#ebebeb 0%,#ebebeb 80%,#fefefe 100%);
}
/* #parts_schedule #calender
=================================================== */
#calender header{
width:100%;
height:70px;
position:relative;
}
/* #calender header h2
------------------------------- */
#calender header h2{
position:absolute;
top:35px;
left:0;
font-family:'Roboto',sans-serif;
font-weight:900;
font-size:18px;
}
/* #calender header h3
------------------------------ */
#calender header h3{
position:absolute;
top:0;
right:95px;
}
#calender header h3:after{content:""; clear:both; display:block;}
#calender header h3 i,
#calender header h3 em{
display:block;
float:left;
font-family:'Roboto',sans-serif;
font-weight:900;
color:#222;
}
#calender header h3 i{
font-size:18px;
padding-top:35px;
letter-spacing:-0.5px;
}
#calender header h3 i:after{
content:"\002f";
padding:0 3px 0 4px;
}
#calender header h3 em{
font-size:42px;
padding-top:16px;
letter-spacing:-3.5px;
}
/* #calender header p.btn
------------------------------ */
#calender header p.btn{
position:absolute;
top:20px;
right:0;
}
#calender header p.btn a{
display:block;
border-radius:15px;
font-size:12px;
letter-spacing:-1px;
color:#320;
width:80px;
height:30px;
line-height:29px;
text-align:center;
background:#febf0f;
background:-moz-linear-gradient(left,#febf0f 0%,#fed000 30%,#fed000 70%,#febf0f 100%);
background:-webkit-linear-gradient(left,#febf0f 0%,#fed000 30%,#fed000 70%,#febf0f 100%);
background:linear-gradient(to right,#febf0f 0%,#fed000 30%,#fed000 70%,#febf0f 100%);
}
#calender header p.btn a.hover{
background:#ff9900;
background:-moz-linear-gradient(left,#ff9900 0%,#ffbb00 30%,#ffbb00 70%,#ff9900 100%);
background:-webkit-linear-gradient(left,#ff9900 0%,#ffbb00 30%,#ffbb00 70%,#ff9900 100%);
background:linear-gradient(to right,#ff9900 0%,#ffbb00 30%,#ffbb00 70%,#ff9900 100%);
}
/* #calender .week
-------------------------------------------------- */
#calender ul.week:after{content:""; clear:both; display:block;}
#calender ul.week{
border-left:1px solid #d2d2d2;
}
#calender ul.week li{
float:left;
width:14.28571428%;
height:15px;
background:#7f7f7f;
text-align:center;
font-size:11px;
line-height:15px;
color:#fff;
border-right:1px solid #8f8f8f;
}
#calender ul.week li:last-child{
border-right:1px solid #d2d2d2;
}
/* #calender .list
-------------------------------------------------- */
#calender .list{
border-left:1px solid #d2d2d2;
background:#dcdcdc;
}
#calender .list:after{content:""; clear:both; display:block;}
#calender .list dl{
background:#fff;
float:left;
width:14.28571428%;
height:58px;
text-align:center;
border-right:1px solid #d2d2d2;
border-bottom:1px solid #d2d2d2;
}
#calender .list dl:first-child{
position:relative;
}
#calender .list dl:first-child:before{
position:absolute;
top:0;
left:-1px;
background:#d2d2d2;
content:"";
float:left;
width:1px;
height:58px;
}
#calender.sun .list dl:first-child{margin-left:0;}
#calender.mon .list dl:first-child{margin-left:14.28571428%;}
#calender.tue .list dl:first-child{margin-left:28.57154856%;}
#calender.wed .list dl:first-child{margin-left:42.85714284%;}
#calender.thu .list dl:first-child{margin-left:57.142857126%;}
#calender.fri .list dl:first-child{margin-left:71.4285714%;}
#calender.sat .list dl:first-child{margin-left:85.71428568%;}

#calender .list dl dt{
line-height:19px;
height:18px;
background:#404040;
font-family:'Roboto',sans-serif;
font-weight:900;
font-size:13px;
color:#fff;
}
#calender .list dl dd{
height:40px;
padding-left:1px;
}
#calender .list dl dd i{
display:block;
width:94%;
margin:2px auto;
font-size:9px;
font-weight:700;
letter-spacing:0.2em;
height:1.5em;
line-height:1.4em;
color:#fff;
border-radius:3px;
}
#calender .list dl dd i.ico_game{background:#f80;}
#calender .list dl dd i.ico_practice{background:#09e;}
#calender .list dl dd i.ico_birthday{background:#3b6;letter-spacing:0.2px;}
#calender .list dl dd i.ico_event{background:#f69;letter-spacing:-1.5px;}

/* =======================================================================
#sungoliath_contents #row_02
========================================================================= */
/* =======================================================
#row_02 #parts_member
========================================================= */
#parts_member{
background:#ebebeb;
display:block;
width:auto;
padding: 4.6666666666667vw 4.6666666666667vw 0;
}
#parts_member h2{
margin-bottom: 4.6666666666667vw;
display:block;
width:100%;
display: flex;
justify-content: space-between;
align-items: center;
}
#parts_member h2 em {
    font-size: 6.6666666666667vw;
    font-family: 'Roboto',sans-serif;
    font-weight: bold;
}
#parts_member h2 a{
display:block;
border-radius:15px;
font-size:12px;
letter-spacing:-1px;
color:#320;
width:90px;
height:30px;
line-height:29px;
text-align:center;
background:#febf0f;
background:-webkit-linear-gradient(left,#febf0f 0%,#fed000 30%,#fed000 70%,#febf0f 100%);
background:linear-gradient(to right,#febf0f 0%,#fed000 30%,#fed000 70%,#febf0f 100%);
}


/* #parts_member .list
-------------------------------------------------- */
#parts_member .list{
}
#parts_member .list a{
display:block;
padding:0;
}
#parts_member .list a figure{
margin-bottom: 6.6666666666667vw;
width:90.6666666666667vw;
height:52vw;
overflow:hidden;
position:relative;
}
#parts_member .list a figure img{
position:absolute;
top:50%;
left:50%;
-webkit-transform:translate(-50%,-50%);
-ms-transform:translate(-50%,-50%);
transform:translate(-50%,-50%);
width:100%;
height:auto;
}
#parts_member .list a dl{
    padding-bottom: 6.6666666666667vw;
}
#parts_member .list a dl dt{
margin-bottom: 4vw;
font-family:'Roboto',sans-serif;
font-weight:900;
font-size:5.3333333333333vw;
color:#222;
text-align:center;
}
#parts_member .list a dl dd{
font-family: 'Roboto',sans-serif;
font-size:4vw;
color:#222;
text-align:center;
}

/* =======================================================
#row_02 #parts_style
========================================================= */
#parts_style {
width: 100vw;
height: 37.3333333333333vw;
background:url(https://www.suntory.com/culture-sports/sungoliath/top/img/sp_team.jpg) no-repeat 0 0;
background-size: 100% auto;
}
#parts_style a {
    display: block;
    width: 100vw;
    height: 37.3333333333333vw;
}
#parts_style a h2 {
    padding: 6.6666666666667vw 4.6666666666667vw;
    font-size: 6.6666666666667vw;
    font-family:'Roboto',sans-serif;
    font-weight:900;
    color: #fff;
}

/* =======================================================
#row_03 #parts_history
========================================================= */
#parts_history {
width: 100vw;
height: 37.3333333333333vw;
background:url(https://www.suntory.com/culture-sports/sungoliath/top/img/sp_history.jpg) no-repeat 0 0;
background-size: 100% auto;
}
#parts_history a {
    display: block;
    width: 100vw;
    height: 37.3333333333333vw;
}
#parts_history a h2 {
    padding: 6.6666666666667vw 4.6666666666667vw;
    font-size: 6.6666666666667vw;
    font-family:'Roboto',sans-serif;
    font-weight:900;
    color: #fff;
}

/* =======================================================
#row_03 #parts_clasic
========================================================= */
#parts_clasic {
width: 100vw;
height: 37.3333333333333vw;
background:url(https://www.suntory.com/culture-sports/sungoliath/top/img/sp_classic.jpg) no-repeat 0 0;
background-size: 100% auto;
}
#parts_clasic a {
    display: block;
    width: 100vw;
    height: 37.3333333333333vw;
}
#parts_clasic a h2 {
    padding: 6.6666666666667vw 4.6666666666667vw;
    font-size: 6.6666666666667vw;
    font-family:'Roboto',sans-serif;
    font-weight:900;
    color: #fff;
}



/* =========================================================================
#sungoliath_contents #parts_bnr_area
========================================================================= */
#parts_bnr_area{
padding:20px 20px 0 20px;
}
#parts_bnr_area ul li{
padding-bottom:20px;
}
#parts_bnr_area ul li img{
width:100%;
height:auto;
box-shadow:0px 0px 10px 2px #dedede;
-moz-box-shadow:0px 0px 10px 2px #dedede;
-webkit-box-shadow:0px 0px 10px 2px #dedede;
}
#parts_bnr_area ul li a.hover img{
opacity:0.7;filter:alpha(opacity=70);-ms-filter:"alpha(opacity=70)";
}

/* =========================================================================
#sungoliath_contents #sns_area
========================================================================= */
#sungoliathCommonFooter h1{background:linear-gradient(#e3e3e3 50%,#000 50%,#000);}
/* ↑↓の背景色に合わせる。 */
#sns_area{
background:#e3e3e3;
padding:0 6% 2em 5.2%;
text-align:center;
}
#tw_block,
#fb_block{
width:100%;
padding-top:2em;
}
