@charset "utf-8";
@import url("/wnb/common/css/common.css");

#suntoryCommonFt_ShareBtn{display:none;}

/* ========= main start ========= */
div#wrapper{width:100%; min-width: 1164px; margin:auto;}

.kvArea{
 background: url(../img/kv_img.png) no-repeat top center;
 position:relative;
}

.kvWarp{padding:135px 0 203px;}
.kvImg{width:340px; margin:auto;}
.kvTxt{
 width:414px; margin:auto;
 padding-top:66px;
}

.kvAnchor{position:relative;}

.anchorArea{
 width: 100%;
 max-height: 24px;
 padding:26px 0 25px;
 background-color: rgba(255,255,255,.9);
 border-bottom: 1px solid#D1DEE1;
 position: absolute;
 bottom:0;
}

.anchorList{
 text-align: center;
}
.anchorList li{
 display:inline-block;
 padding-right:67px;
}
.anchorList a{cursor: pointer;}
.anchorList a::after{
 content:'';
 width:13px;
 height:13px;
 display:inline-block;
 background: url(/wnb/common/img/arrow.png) no-repeat center;
 background-size: 100%;
 margin-left:6.4px;
}
.anchorList a:hover{text-decoration: underline;}

/* section01 */

.section01{
 padding:80px 0 45px;
}

.section01 h2{
 width:150px;
 margin:auto;
 padding-bottom:40px;
}

.s01Notice{
 border:1px solid #CCCCCC;
 margin-bottom:28px;
}
.s01Notice dl{
 display:inline-block;
 padding:32px 29px 33px 29px;
}
.s01Notice dt{
 display: inline-block;
 padding-right: 50px;
 font-weight: bold;
 font-size: 18px;
}
.s01Notice dd.date{
 padding-right:20px;
}
.s01Notice dd{
 display: inline-block;
 font-size: 15px;
}

.mr4{margin-right: 4px;}

.s01mainList{
 /* display:flex;
 justify-content: space-between; */
 display: table;
}

.s01mainList li{
 display: table-cell;
 width:49.8%;
 border:1px solid #DDDDDD;
 box-sizing: border-box;
}

.s01ListTxt{
 padding:25px 30px;
 min-height: 6vw;
}
.s01ListTxt h3{padding-bottom:10px; font-size: 20px;}
.s01ListTxt p{line-height: 1.71; font-size: 14px;}
.s01BtnArea{
 max-width:240px;
 box-sizing: border-box;
 border:1px solid #666666;
 margin:0 auto 33px;
}
.s01BtnArea a{
 padding:5.3px 0 9.7px;
 text-align: center;
 font-size: 12px;
 font-weight: bold;
}

/* section02 */

.section02{
 position:relative;
}
.section02 .s02bg{
 position:relative;
 z-index:-1;
 background: url(/wnb/img/section02_main.png) no-repeat center bottom;
 min-height: 1183px;
}

.section02 h2{
 width:245px;
 position: absolute;
 top:9%;
 left:0; right: 0;
 margin:auto;
}



.s01ItemIcon a{width:100%;}

.s02ItemList > li{width:300px; position:absolute;}
.s02ItemList li:nth-child(1){top:7.2%; left:-.5%;}
.s02ItemList li:nth-child(2){top:15.6%; left:63.7%;}
.s02ItemList li:nth-child(3){top:31.7%; left:28%;}
.s02ItemList li:nth-child(4){width:248px; top:62.8%; left:.8%;}
.s02ItemList li:nth-child(5){width:248px; top:62.8%; left:36.8%;}
.s02ItemList li:nth-child(6){width:248px; top:62.6%; left:69.9%;}

.s02Iconlis{
 max-width: 1100px; width: 100%; margin:auto;
 position: absolute;
 top:0; bottom:0; left:0; right: 0;
}


.s01ItemIcon li{width:45px; position:absolute; cursor: pointer;}

.s01linkIcon01 li:nth-child(1){top:55%; left:82%; transform: translate(27%,58%);}
.s01linkIcon01 li:nth-child(2){top:80%; left:73%;}

.s01linkIcon02 li:nth-child(1){top:62%; left:-3%;}
.s01linkIcon02 li:nth-child(2){top:76%; left:8%;}

.s01linkIcon03 li:nth-child(1){top:62%; left:-3%;}
.s01linkIcon03 li:nth-child(2){top:76%; left:8%;}

.s01linkIcon04 li:nth-child(1){top:60%; left:-8%;}
.s01linkIcon04 li:nth-child(2){top:76%; left:7%;}

.s01linkIcon05 li:nth-child(1){top:60%; left:-8%;}
.s01linkIcon05 li:nth-child(2){top:76%; left:7%;}

.s01linkIcon06 li:nth-child(1){top:60%; left:-8%;}
.s01linkIcon06 li:nth-child(2){top:76%; left:7%;}

/* .s02BtnArea{padding:65px 0 73px;} */
.s02BtnArea a{
 width:400px;
 margin:auto;
 position:absolute;
 bottom:5%;
 left:0; right: 0;
}

/* section03 */

.s03Area ul{
 width:100%;
 display:table;
}
.s03Area li{
 display:table-cell;
 position:relative;
}

.s03ReadContent{
 position:absolute;
 right:3%; top:39%;
}

.s03TxtArea p{
 line-height: 1.63;
 font-size: 0.833335vw;
 padding-bottom:1.5625vw;
}
.s03BtnArea{max-width:69.566%; width:100%;}

.s03SearchContent{
 position:absolute;
 left:8.5%; top:38.5%;
}

.s03ReadContent,.s03SearchContent{max-width:36.26%;}

/* section04 */


.section04{padding:50px 0 70px;}

.section04 h2{
 max-width:124px;
 margin:auto;
 padding-bottom:50px;
}

.s04Item{
 width:100%;
 display: block;
 text-align: center;
}
.s04NewsList{
 padding:50px;
 background-color: #ECF6F9;
}
.s04NewsItem{
 display: table;
 margin-bottom:30px;
}
.s04NewsItem:last-child{margin-bottom: 0px;}
.s04NewsItem dt,
.s04NewsItem dd{
 display: table-cell;
}
.s04NewsItem .dateArea{
 width:80px;
 vertical-align: top;
 padding-right: 10px;
}
.s04NewsItem .categoryIcon{
 width:90px;
 vertical-align: top;
 padding-top:4px;
}
.s04NewsItem .categoryIcon span{
 display: block;
 height: 20px; line-height: 18px;
 font-weight: bold;
 font-size: 11px;
 text-align: center;
 color: #fff;
}
.contentIcon{background-color: #0F96B8;}
.campaignIcon{background-color:#FC962C;}
.newitemIcon{background-color:#F95475;}
.s04NewsItem .newsTitle{padding-left: 10px;}
.s04NewsItem .newsTitle .newsNotes{display:block;font-size:14px;}
.s04NewsItem a:hover .newsTitle{text-decoration: underline;}
.s04NewsItem .newsTitle img {width: 12px; height: 12px; display: inline; padding-left: 10px;}

/* ========= main end ========= */

@media only screen and (max-width: 767px){
/* ========= main start ========= */
div#wrapper{width:100%; min-width: 0; margin:auto;}

.kvWarp{ padding:27.8134vw 0 47.3vw;}
.kvImg{
 width: 48vw !important;
 margin: auto;
}
.kvTxt{
 width:61.185vw; margin:auto;
 padding-top: 7.68vw;
}

.kvArea{
 background: url(../img/kv_img_sp.png) no-repeat top center;
 background-size: 100%;
}

.kvAreaItem{
 position:absolute;
 top:95%;
}

.kvAnchor{
 position: relative;
}

.anchorArea{
 width:100%;
 max-height:18.67vw;
 padding:4.26666vw 0 4vw;
 /* position:absolute;
 bottom:0;
 margin-bottom:0; */
}
.anchorArea.fixedNav{ padding:4.26666vw 0 1vw;}

.anchorList{margin: 0 auto; width:75vw !important;}
.anchorList li a{font-size: 4.26666vw;}
.anchorList li.onlySp{display:inline-block !important;}
.anchorList li{padding-right:8.26666vw;}
.anchorList li:nth-of-type(1){padding:0 5.8vw 2.66668vw 0;}
.anchorList li:nth-of-type(2),
.anchorList li:nth-of-type(6){padding-right: 0;}

.anchorList a::after { width: 3.47vw; height: 3.47vw;}

.s01mainList,.s01mainList li{display: block; float: none;}

/* section01 */
.section01{padding-bottom:4.8vw;}
.section01 h2{width:33.6vw; padding-bottom:6.66666vw;}

.s01Notice{margin-bottom:9.33334vw;}
.s01Notice dl{padding:13px 12px 12px 17px;}
.s01Notice dt{width:100%; padding-right: 0; font-size: 4.8vw;}
.s01Notice dd.date{padding:7px 0 6px;}
.s01Notice dd{font-size: 4vw;}

.s01ListTxt {padding: 15px 18px 21px;}
.s01BtnArea{
 max-width: 82.935vw;
 margin:0 auto 21px auto;
}
.s01BtnArea a{
 padding:10px 0 11px; font-size:4.26666vw;
}
.s01ListTxt h3{font-size: 5.33333vw;}
.s01ListTxt p { font-size:4.26666vw;}


.s01mainList{display:block;}
.s01mainList li{width:auto;}
.s01mainList li:nth-of-type(1){margin-bottom:8vw}

/* section02 */
.s01ItemIcon li{width:5vw;}

.section02 .s02bg{background:none; min-height: auto;}
.s01ItemIcon a {width: 12vw;}
.s02ItemList > li {width: 48vw; height: 48vw; }
.s02ItemList li:nth-child(1) { top: 11.6%; left: 4.5%;}
.s02ItemList li:nth-child(2) { top: 25.6%; left: 48%;}
.s02ItemList li:nth-child(3) { top: 39.6%; left: 5%;}
.s02ItemList li:nth-child(4) { width:40vw; height:40vw; top: 57.8%; left: 54.2%;}
.s02ItemList li:nth-child(5) { width:40vw; height:40vw; top: 65.4%; left: 8.5%;}
.s02ItemList li:nth-child(6) { width:40vw; height:40vw; top: 73.5%; left: 51.5%;}

.s01linkIcon01 li:nth-child(1){top:35%; left:80%;}
.s01linkIcon01 li:nth-child(2){top:75%; left:66%;}

.s01linkIcon02 li:nth-child(1){top:45%; left:-15%;}
.s01linkIcon02 li:nth-child(2){top:73%; left:2%;}

.s01linkIcon03 li:nth-child(1){top:40%; left:87%;}
.s01linkIcon03 li:nth-child(2){top:68%; left:71%;}

.s01linkIcon04 li:nth-child(1){top:42%; left:-14%;}
.s01linkIcon04 li:nth-child(2){top:74%; left:2%;}

.s01linkIcon05 li:nth-child(1){top:44%; left:82%;}
.s01linkIcon05 li:nth-child(2){top:75%; left:58%;}

.s01linkIcon06 li:nth-child(1){top:43%; left:-14%;}
.s01linkIcon06 li:nth-child(2){top:75%; left:5%;}


.s02BtnArea{
 background-color: #B2FFFF;
 padding:6.26666vw 0 21.33334vw;
}
.section02 h2{
 width:55.47vw;
 top:5%;
}
.s02BtnArea a{
 width: 92vw;
 margin: auto;
 position:static;
 transform:none;
}

.parent-iframe-relative.ec-imp-target img {
 width: 100% !important;
 height: 100% !important;
}
.s02Iconlis{
 position: unset;
}

/* section03 */

.section03{padding-bottom:5.33334vw;}
.s03Area ul,
.s03Area li{ display:block;}

.s03ReadContent,.s03SearchContent{
 max-width: 100%;
 position:static;
 padding:5.33334vw 4vw 16vw 5.33334vw;
}
.s03TxtArea p{font-size: 4.26666vw; max-width:100%; padding-bottom:0;}

.s03BtnArea{
 max-width:82.4vw;
 margin:auto;
 padding-top: 8vw;
}


/* section04 */
.section04{padding:6.6666vw 0 18.6666vw;}
.section04 h2{padding-bottom:8.57144vw;}
.s04NewsList{padding:14.2858vw 4.857vw;}
.categoryIcon{margin-bottom:3vw;}
.s04NewsItem{margin-bottom:12.8572vw;}
.s04NewsItem .dateArea{
 padding-right: 2.66666vw;
 vertical-align: middle;
 font-size: 4.26666vw;
}
.s04NewsItem .newsTitle{
 display: block;
 padding-left: 0px;
 padding-top:4.2857vw;
 font-size: 4.26666vw;
}
.s04NewsItem .newsTitle .newsNotes{
 font-size: 3.73vw;
}
.s04NewsItem .categoryIcon{width:24vw;padding-top:2px;vertical-align: middle;}
.s04NewsItem .categoryIcon span{
 height: 4.18vw;
 line-height: 1.3;
 font-size: 3.2vw;
}

}