@charset "UTF-8";

#suntory_contents {width: 100%;overflow:hidden;}

/*pc-tablet*/
@media screen and (min-width:768px)
{

#suntory_contents .pc_content {display:block;position:relative;}
#suntory_contents .sp_content {display:none; position:relative;}

#suntory_contents .inner_block {position:relative; width: 960px; margin: 0 auto;}
#suntory_contents .inner_block img {width: 100%; height: auto; vertical-align: top;}
#suntory_contents .inner_block a:hover img {transition: 0.3s ease; -webkit-transition: 0.3s ease; opacity: 0.6;}

#suntory_contents #inner_wrap {position: relative; background: url(../img/bg.jpg) center top no-repeat #ffffff; background-size: cover; padding-bottom: 180px;}

#suntory_contents #mv {position: relative; height: 728px;}
#suntory_contents #mv h1 {position: absolute; top: 88px; left: 141px; width: 677px;}
#suntory_contents #mv .logo {position: absolute; top: 230px; left: 141px; width: 375px;}
#suntory_contents #mv .btn {position: absolute; top: 208px; right: 142px; width: 248px;}

#suntory_contents #block01 {position: relative;}
#suntory_contents #block01 .inner_block {padding: 100px 0; background: #fff; border-radius: 90px;}
#suntory_contents #block01 .box1 h2 {position: relative; width: 580px; margin: 0 auto;}
#suntory_contents #block01 .box1 .txt {position: relative; width: 820px; margin: 59px auto 0;}
#suntory_contents #block01 .box1 .img {position: relative; width: 831px; margin: 59px auto 0;}
#suntory_contents #block01 .box2 h3 {position: relative; width: 820px; margin: 80px auto 0;}
#suntory_contents #block01 .box2 .txt {position: relative; width: 820px; margin: 36px auto 0;}
#suntory_contents #block01 .box3 h3 {position: relative; width: 820px; margin: 80px auto 0;}
#suntory_contents #block01 .box3 ul {position: relative; display: -webkit-box; display: flex; -webkit-justify-content: space-between; justify-content: space-between; width: 820px; margin: 36px auto 0;}
#suntory_contents #block01 .box3 li {position: relative; width: 375px;}
#suntory_contents #block01 .box3 li:first-child h4 {position: relative; width: 353px; margin: 0 auto;}
#suntory_contents #block01 .box3 li:last-child h4 {position: relative; width: 359px; margin: 0 auto;}
#suntory_contents #block01 .box3 .img {margin: 30px 0;}

#suntory_contents #inner_wrap2 {margin-top: 130px; padding-bottom: 150px;}
#suntory_contents #block02 h2 {position: relative; width: 695px; margin: 0 auto 68px;}
#suntory_contents #block02 .block02_list {display: -webkit-flex; display: flex; -webkit-justify-content:space-between; justify-content:space-between; width: 960px;}
#suntory_contents #block02 .block02_list li { width: 290px; -webkit-box-shadow: 0 0 13px 3px rgba(0,0,0,0.1); -moz-box-shadow: 0 0 13px 3px rgba(0,0,0,0.1); box-shadow: 0 0 13px 3px rgba(0,0,0,0.1); box-sizing: border-box; border: 1px solid #eeeeee; margin-right: 15px; }
#suntory_contents #block02 .block02_list li:last-child {margin-right: 0;}

}



/*sp*/
@media screen and (max-width:767px)
{

#suntory_contents .pc_content {display:none;}
#suntory_contents .sp_content {display:block; background: #ffffff;}

#suntory_contents .inner_block img {width: 100%; height: auto; vertical-align: top;}
#suntory_contents #inner_wrap {position: relative; background: url(../img/bg_sp.jpg) center top no-repeat #ffffff; background-size: 100% auto; padding-bottom: 30.27vw;}
#suntory_contents #inner_wrap2 {margin-top: 26.67vw;}

#suntory_contents #block01 {position: relative; margin: 13.33vw 6.66vw 0; padding: 16vw 0; background: #fff; border-radius: 40px;}
#suntory_contents #block02 {position: relative; margin: 0 6.66vw; padding-bottom: 26.67vw;}
#suntory_contents #block02 .block02_list li {margin-bottom: 8vw; -webkit-box-shadow: 0 0 13px 3px rgba(0,0,0,0.1); box-shadow: 0 0 13px 3px rgba(0,0,0,0.1); box-sizing: border-box; border: 1px solid #eeeeee;}
#suntory_contents #block02 .block02_list li:last-child {margin-bottom: 0;}

}
