@charset "utf-8";

/*----------------------------------------
reset
----------------------------------------*/
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

/*html, body, */div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
/*a,*/ abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, /*ul, li,*/
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
  display: block;
}
/*body {
  line-height: 1;
}*/
ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/*----------------------------------------
reset(unique)
----------------------------------------*/
a {
  text-decoration: none;
  line-height: 0;
}
a:hover {
  text-decoration: underline;
}
ul {
  padding: 0;
  margin: 0;
}

/*----------------------------------------
common
----------------------------------------*/
.clearfix::after {
  content: "";
  display: block;
  clear: both;
}
#suntory_contents {
  font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", 'Noto Sans Japanese', Osaka, sans-serif;
  font-size: 85%;
  line-height: 1.5;
  color: #333;
  overflow: hidden;
}
#suntory_contents a {
  color: #333;
}
#suntory_contents a img:hover {
  opacity: 0.6;
}
section {
  margin-bottom: 2.2em;
}
span {
  display: inline-block;
}
#cont {
  width: 100%;
  max-width: 1164px;
  min-width: 960px;
  margin: 2.2em auto 0;
}

/*----------------------------------------
header
----------------------------------------*/
.bg_header {
  background-color: #07194e;
}
.txt_header {
  max-width: 1164px;
  min-width: 960px;
  margin: 0 auto;
  padding: 1.5em 0;
  height: 2em;
  position: relative;
}
.txt_header h1 {
  color: #fff;
  font-size: 1.7em;
}
#suntory_contents .txt_header h1 a {
  color: #fff;
}
.txt_header h1 a:hover {
  text-decoration: none;
}
.txt_header h1 span {
  font-size: 70%;
  padding-left: 2%;
}
.nav_header_pc {
  position: absolute;
  right: 0;
  bottom: 0.8em;
}
#suntory_contents .nav_header_pc a {
  color: #fff;
}
.nav_header_pc li {
  display: inline-block;
  padding: 0 10px;
  position: relative;
}
.nav_header_pc li:after {
  content: "｜";
  color: #fff;
  position: absolute;
  right: -10px;
}
.nav_header_pc li:last-child:after {
  content: "";
}

/*----------------------------------------
#main
----------------------------------------*/
#main {
  margin-bottom: 1.6em;
}
.img_header {
  width: 100%;
  min-width: 960px;
}
.img_header img {
  width: 100%;
}
@media screen and (min-width: 1165px) {
  .img_header {
    background: url(../img/parts/main.jpg) center no-repeat;
    background-size: cover;
    height: 310px;
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
  }
  .img_header p {
    display: none;
  }
}

/*----------------------------------------
#menu_div
----------------------------------------*/
#menu_div .link_div {
  width: 100%;
  line-height: 0;
}
#menu_div .link_div li {
  float: left;
  width: 31.8%;
  margin-right: 2.3%;
}
#menu_div .link_div li:nth-child(3) {
  margin-right: 0;
}
#menu_div .link_div li img {
  width: 100%;
}

/*----------------------------------------
#slider
----------------------------------------*/
#slider {
  background-color: #eeeeee;
}
.inner_slider {
  display: none;
  width: 93%;
  max-width: 1160px;
  margin: 0 auto;
}
.inner_slider.slick-initialized {
  display: block;
}
.slider_arrow {
  position: absolute;
  top: 36%;
  z-index: 2;
}
.slider_arrow:hover {
  cursor: pointer;
}
.arrowPrev {
  left: -2.4%;
}
.arrowNext {
  right: -2.4%;
}
.inner_slider li>div {
  background-color: #fff;
  padding: 3.5%;
  margin: 7% 3.5%;
}
.inner_slider li img {
  width: 100%
}
.inner_slider p {
  font-size: 0.9em;
  margin-top: 3.5%;
}

/*----------------------------------------
#desc
----------------------------------------*/
#desc {
  background-color: #07194e;
  padding: 0.8%;
}
#desc p {
  border: 1px solid rgba(256,256,256,0.5);
  padding: 1.6em 0.8%;
  color: #fff;
  text-align: center;
  font-size: 1.2em;
  line-height: 1.8;
}

/*----------------------------------------
#news
----------------------------------------*/
#news {
  background-color: #eeeeee;
  padding: 1.6% 2.3%;
}
#news h2 {
  font-size: 1.2em;
  font-weight: bold;
  padding-bottom: 0.1em;
  border-bottom: 1px solid #666;
}
.list_news {
  padding-top: 0.8em;
}
.list_news li {
  display: table;
  width: 100%;
  margin-bottom: 0.3em;
}
.list_news li:last-child {
  margin-bottom: 0;
}
.day_news, .txt_news {
  display: table-cell;
}
.day_news {
  width: 15%;
  min-width: 120px;
}
.txt_news {
  width: 85%;
}
.day_news:before {
  content: "・";
}
.list_news a {
  line-height: 1.4;
}

/*----------------------------------------
bnr
----------------------------------------*/
#bnr {
  text-align: center;
}

#bnr ul li {
  display: inline-block;
  margin-right:2.2em;
}

#bnr ul li:last-child {
  margin-right:0;
}


/*----------------------------------------
footer
----------------------------------------*/
footer {
  background-color: #07194e;
  padding: 0.8em 0 2.2em;
  font-size: 1.2em;
  height: 1.5em;
}
.nav_footer {
  width: 875px;
  margin: 0 auto;
  text-align: center;
}
.nav_footer li {
  display: inline-block;
  padding: 0 16px;
  position: relative;
}
.nav_footer li:after {
  content: "｜";
  color: #fff;
  position: absolute;
  right: -12px;
}
.nav_footer li:last-child:after {
  content: "";
} 
#suntory_contents .nav_footer a {
  color: #fff;
}

.PCview {display: block;}
.SPview {display: none;}

/*========================================
========================================
========================================
for SP
========================================
========================================
========================================*/
@media screen and (max-width: 767px) {
.PCview {display: none;}
.SPview {display: block;}

/*----------------------------------------
common
----------------------------------------*/
#suntory_contents {
  font-size: 12px;
}
section {
  margin: 0 3% 3vh;
}
#cont {
  min-width: unset;
}

/*----------------------------------------
header
----------------------------------------*/
.txt_header {
  max-width: unset;
  min-width: unset;
  height: 64px;
  padding: 0;
  position: relative;
}
.txt_header h1 {
  font-size: 158%;
  font-weight: bold;
  padding: 12px 0 12px 3%;
}
.txt_header h1 a {
  line-height: 1;
}
.txt_header h1 span {
  display: block;
  font-size: 50%;
  padding-left: 0;
}
.btn_nav_header {
  display: inline-block;
  height: 44px;
  width: 44px;
  background: url(../../2019common/img/parts/btn_open_sp.svg) no-repeat;
  background-size: contain;
  position: absolute;
  right: 3%;
  top: 10px;
}
.btn_nav_header.open {
  background: url(../../2019common/img/parts/btn_close_sp.svg) no-repeat;
  background-size: contain;
}
.nav_header_sp {
  display: none;
  background-color: #07194e;
  padding-top: 10px;
  z-index: 3;
}
#suntory_contents .nav_header_sp a {
  color: #fff;
}
.sub_nav_header {
  margin: 0 3% 10px;
}
.sub_nav_header li {
  display: inline-block;
  margin-right: 5%;
}
.sub_nav_header .lang a:hover {
  text-decoration: none;
}
.sub_nav_header .lang p {
  font-family: arial;
  font-weight: bold;
  padding: 1em 1px 6px;
}
.sub_nav_header .lang.active p {
  border-bottom: 3px solid #a9acb9;
}
.sub_nav_header .sns {
  height: 20px;
}
.sub_nav_header .sns img {
  height: 100%;
  margin-bottom: -6px;
}
.cont_nav_header li {
  border-bottom: 1px solid #1e2b5e;
}
.cont_nav_header li:first-child {
  border-top: 1px solid #1e2b5e;
}
.cont_nav_header li p {
  position: relative;
  padding: 1.4em 3%;
  font-size: 130%;
  font-weight: bold;
}
.cont_nav_header li p:after {
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f105';
  color: #fff;
  font-size: 140%;
  position: absolute;
  right: 3%;
}
.txtbtn_close {
  width: 100px;
  padding: 4% 0;
  margin: 0 auto;
  font-size: 130%;
  text-align: center;
}
.txtbtn_close p {
  background-color: #fff;
  padding: 0.4em 0;
  color: #07194e;
  font-weight: bold;
}

/*----------------------------------------
#main
----------------------------------------*/
#main{
  margin-bottom: 0.6em;
}
.img_header {
  min-width: unset;
}

/*----------------------------------------
#menu_div
----------------------------------------*/
#menu_div .link_div li {
  float: none;
  width: 100%;
  margin: 0 0 0.6em;
}

/*----------------------------------------
#slider
----------------------------------------*/
section#slider {
  margin-left: 0;
  margin-right: 0;
}
.inner_slider {
  width: 86%;
}
.slider_arrow {
  top: 26%;
  width: 4%;
}
.arrowPrev {
  left: -5%;
}
.arrowNext {
  right: -5%;
}
.inner_slider li>div {
  margin: 7% 1.5%;
}

/*----------------------------------------
#desc
----------------------------------------*/
#desc {
  background-color: #07194e;
  padding: 1.6%;
}
#desc p {
  padding: 1.2em 5%;
  text-align: left;
  font-size: 110%;
}
#desc p br {
  display: none;
}

/*----------------------------------------
#news
----------------------------------------*/
#news {
  padding: 3%;
}
.list_news li {
  display: block;
  margin-bottom: 0.8em;
}
.day_news {
  display: block;
  width: 100%;
}
.txt_news {
  display: block;
  width: 96%;
  padding-left: 4%;
}
.day_news:before {
  content: "●";
}

/*----------------------------------------
bnr
----------------------------------------*/
#bnr ul li {
  margin-right:2%;
  width:48%;
}
#bnr ul li:last-child {
  margin-right:0;
}
#bnr ul li img {
  width:100%;
}

/*----------------------------------------
#gotop
----------------------------------------*/
.txtbtn_gotop {
  font-size: 120%;
  color: #06194f;
  text-align: right;
}
.txtbtn_gotop span {
  font-size: 180%;
  vertical-align: middle;
  padding-left: 2%;
}

/*----------------------------------------
footer
----------------------------------------*/
footer {
  padding: 1.6em 5%;
  height: unset;
}
.company {
  color: #fff;
  line-height: 2;
}
#suntory_contents .company a {
  color: #fff;
}
.company dt {
  text-align: center;
  padding-bottom: 1em;
}
.company dd {
  display: table;
  width: 100%;
  position: relative;
  font-size: 90%;
}
.company dd>div {
  display: table-cell;
  vertical-align: top;
}
.company .txt_contact {
  width: 75%;
}
@media screen and (max-width: 374px) {
  .company .txt_contact {
    width: 82%;
  }
}
.company .btn_contact {
  width: auto;
}
.company .btn_contact li {
  text-align: center;
  border: 1px solid #fff;
}
.company .btn_contact li:nth-child(2) {
  margin-top: 1em;
}
.company .btn_contact li p {
  padding: 22px 0;
}
.txt_company {
  color: #90a2d2;
  font-size: 80%;
  text-align: center;
  margin-top: 2em;
}

}

/*========================================
========================================
========================================
for SP(landscape)
========================================
========================================
========================================*/
@media screen and (max-width: 767px) and (orientation: landscape) {

section {
  margin-bottom: 7vh;
}

}