@charset "Shift_JIS";

#cbanner {background: url(img/banner.jpg) no-repeat 50% 50%;background-size: cover;} 
#cbanner a {display: block;text-align: center;height: 130px;overflow: hidden;font-size: 27px;line-height: 130px;color: #FFF;font-feature-settings: 'palt' 1;transition: background 0.3s ease;} 
#cbanner a:hover {background: rgba(255,255,255,0.5);} /*2017.11*/
/*2017.11*/

#topBtn {
  display: flex;
  justify-content: center;
  margin: 30px auto 10px;
}
#topBtn a {
  display: block;
  margin: 0 10px;
  padding: 15px 0;
  text-decoration: none!important;
  border-radius: 40px;
  text-align: center;
  border: solid 1px #BBB;
  font-family: YuMincho, 'Yu Mincho', '‚l‚r ‚o–¾’©', 'MS PMincho' , serif;
  color: #000;
  position: relative;
  line-height: normal;
}
#topBtn a ::after{
  content: "";
  position: absolute;
  top: 50%;
  right: 20px;
  width: 6px;
  height: 6px;
  border-top: 1px solid #555;
  border-right: 1px solid #555;
  transform: rotate(45deg);
  margin-top: -5px;
}
#topBtn a:hover {
  opacity: 0.75;
}
#topBtn a span {
  display: block;
  padding: 0 50px;
  min-width: 360px;
}

#footBtn {
  display: flex;
  justify-content: center;
  margin: auto auto 60px;
}
#footBtn a {
  display: block;
  margin: 0 10px;
  padding: 15px 0;
  text-decoration: none!important;
  border-radius: 40px;
  text-align: center;
  border: solid 1px #BBB;
  font-family: YuMincho, 'Yu Mincho', '‚l‚r ‚o–¾’©', 'MS PMincho' , serif;
  color: #000;
  position: relative;
  line-height: normal;
}
#footBtn a ::after{
  content: "";
  position: absolute;
  top: 50%;
  right: 20px;
  width: 6px;
  height: 6px;
  border-top: 1px solid #555;
  border-right: 1px solid #555;
  transform: rotate(45deg);
  margin-top: -5px;
}
#footBtn a:hover {
  opacity: 0.75;
}
#footBtn a span {
  display: block;
  padding: 0 50px;
  min-width: 360px;
}

@media screen and (min-width: 1280px) {
#lineuptop {height: 505px;position: relative;background: #F5F4F6 url(img/lineupbg.jpg) no-repeat 50% 50%;background-size: 1280px auto;}
}

.contbody {position: relative;}
.contbody a {color: #000;text-decoration: none;}
.contbody h1, .contbody h2, .contbody h3, .contbody dt, .contbody dd, .contbody li, .contbody p, .contbody span, .contbody select {
font-family: YuMincho, 'Yu Mincho', '‚l‚r ‚o–¾’©', 'MS PMincho' , serif;
}

#topimage {background: url(img/topbg.png) no-repeat 50% 0;}

.panellink {position: relative;bcursor: pointer;transition: opacity 0.3s ease;}
.panellink:hover {opacity: 0.7;}


#conceptLink {background: url(img/topconceptbg.jpg) no-repeat 50% 50%;background-size: 100% auto;}
/*#lineupLink {background: url(img/lineupbg.jpg) no-repeat 50% 50%;background-size: 100% auto;}*/
/*2019.12 up*/
#lineupLink {background: url(img/lineupbg.jpg) no-repeat 50% 77%;background-size: 85% auto;}

#columnLink {background: url(img/topcolumnbg.jpg) no-repeat 50% 50%;background-size: 100% auto;}

.panellink p.link {font-family: 'EB Garamond', serif;font-feature-settings: 'palt' 1;}
.panellink p.link a {display: block;}
.panellink p.note {color: #999;}
.panellink p.read {line-height: 2;}

#lineuplist .link a {z-index: 5;position: relative;display: block;height: 60px;
padding: 0;background: #b5b5b5;line-height: 60px;font-size: 14px;text-align: center;color: #CCC;}
#lineuplist .link a:before {content: "";position: absolute;left: -18px;width: 0;height: 0;
border-style: solid;border-width: 30px 18px 30px 0;border-color: transparent #b5b5b5 transparent transparent;}
#lineuplist .link a:after {content: "";position: absolute;right: -18px;width: 0;height: 0;
border-style: solid;border-width: 30px 0 30px 18px;border-color: transparent transparent transparent #b5b5b5;}

#lineuplist .link a strong {z-index: 6;position: absolute;top: 1px;left: 1px;right: 1px;bottom: 1px;didsplay: block;background: #FFF;}
#lineuplist .link a strong:before {content: "";position: absolute;top: -1px;left: -18px;width: 0;height: 0;border-style: solid;border-width: 30px 18px 30px 0;border-color: transparent #FFF transparent transparent;}
#lineuplist .link a strong:after {content: "";position: absolute;top: -1px;right: -18px;width: 0;height: 0;border-style: solid;border-width: 30px 0 30px 18px;border-color: transparent transparent transparent #FFF;}

#lineuplist .link a:hover {background: #000;color: #000;}
#lineuplist .link a:hover:before {border-color: transparent #000 transparent transparent;}
#lineuplist .link a:hover:after {border-color: transparent transparent transparent #000;}

#letternavi {background-color: rgba(255,255,255,0.4);}
#letternavi li {float: left;background-color: rgba(255,255,255,0.8);text-align: center;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
cursor: pointer;}
#letternavi p.title {float: left;background-color: rgba(255,255,255,1);text-align: center;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;}

#letternavi li.on,
#letternavi li:hover {background-color: rgba(255,255,255,1);}
#letternavi li.off {background-color: rgba(255,255,255,0.8);}

#letterbody .read {margin-bottom: 50px;text-align: center;font-size: 14px;line-height: 2;}
#letterbody .date {height: 90px;background: url(img/datebg.png) no-repeat 50% 50%;background-size: 80px 90px;text-align: center;font-family: 'EB Garamond', serif;font-feature-settings: 'palt' 1;color: #B5B5B5;margin-top: 53px;}
#letterbody .date small {display: block;padding-top: 18px;font-size: 14px;line-height: 1.2;}
#letterbody .date strong {display: block;margin-top: -10px;font-size: 48px;line-height: 1.2;font-weight: normal;}

#letterbody .title {text-align: center;line-height: 1.5;}
#letterbody .caption {text-align: center;line-height: 1.8;}
#letterbody .textarea p {font-size: 14px;line-height: 2;}
#letterbody .textarea p.textname {text-align: right;}

/*
#areacolumn2 {display: none;}
*/
.columnarea {display: none;}
#areacolumn1 {display: block;}


#bknavi {border-top: 1px solid #EEE;}
#bknavi li {padding: 10px 0 0 0;}
#bknavi li.prev {float: left;}
#bknavi li.next {float: right;}

#bknavi li a {display: block;padding: 20px 25px;}
#bknavi li.prev a {background: url(img/arrowleft.png) no-repeat 0 50%;background-size: 6px 54px;}
#bknavi li.next a {background: url(img/arrowright.png) no-repeat 100% 50%;background-size: 6px 54px;}

#bknavi li a:hover {opacity: 0.7;}

.bklist select {
-moz-appearance: none;
-webkit-appearance: none;
-o-appearance: none;
-ms-appearance: none;
appearance: none;border-radius: 4px;border: 0;margin: 0;padding: 0;background: none transparent;vertical-align: middle;
color: inherit;box-sizing: content-box;padding: 5px 90px 4px 12px;background: #FFF url(img/selectarrow.png) no-repeat 100% 0;background-size: 33px 33px;}
.bklist select::-ms-expand {display: none;}
.bklist select,
.bklist p {display: inline-block;font-size: 13px;}
.bklist p {padding: 0 8px 0 0;}

#bknavi .bklist select {border: 1px solid #DDD;}

.sct {position: relative;padding-bottom: 50px;}
.sct:after {content: ".";display: block;clear: both;height: 0;visibility: hidden;}
.sct .title {color: #888;font-family: 'EB Garamond', serif;letter-spacing: 2;}
.sct .read {font-family: YuGothic, 'Yu Gothic', serif;font-feature-settings : "palt";}
.hidebox {height: 8.2em;overflow: hidden;}
.hidebox p {margin-bottom: 0.5em;}
.hidebox p strong {font-weight: bold;}

.hidebox p.hideboxlink a {text-decoration: underline;}

.hidebox_nav {position: absolute;bottom: 10px;background:#FFF;font-size: 10pt;line-height: 1.6;cursor: pointer;}
.hidebox_nav li {display: block;border: 1px solid #CCC;background: #FFF;color: #999;text-align: center;transition: 0.3s ease 0s;font-size: 9pt;line-height: 3.5;font-family: YuGothic, 'Yu Gothic', serif;}
.hidebox_nav li:hover {border: 1px solid #666;color: #333;}
.hidebox_nav .open {dispaly: block;background: url(img/navopen.png) no-repeat 100% 50%;background-size: 29px 21px;}
.hidebox_nav .close {display: none;background: url(img/navclose.png) no-repeat 100% 50%;background-size: 29px 21px;}

#lineuplist span.mark {display: inline-block;padding: 1px 3px 2px 3px;border: 1px solid #CCC;border-radius: 1px;line-height: 1.4;font-size: 11px;}


#campaignLink p {
	width:950px;
	margin:25px auto 0;}

@media only screen and (min-width: 769px) {
/* PC */
.br_PC {display: inline;} .br_SP {display: none;}

#topimage {position: relative;height: 704px;overflow: hidden;}
#pagescroll {z-index: 4;position: absolute;left: 50%;bottom: 0;width: 88px;height: 60px;overflow: hidden;margin-left: -44px;text-indent: -9999px;background: url(img/scroll.png) no-repeat 0 0;background-size: 88px 60px;cursor: pointer;}

#titlelogo {z-index: 3;position: absolute;top: 0;left: 50%;width: 252px;margin-left: -126px;}
#titlelogo img {width: 252px;height: auto;}

#bottle {z-index: 2;position: absolute;top: 20px;left: 50%;width: 197px;margin-left: -98px;}
#bottle img {width: 197px;}

#toptext {position: absolute;top: 175px;left: 50%;width: 570px;margin-left: -285px;text-align: right;}



#toptext img {width: 76px;}

#badge {position: absolute;top: 257px;left: 50%;width: 976px;margin-left: -488px;}
#badge img {width: 176px;}

.panellink .wrap {height: 400px;
background: -moz-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 75%);
background: -webkit-linear-gradient(left, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 75%);
background: linear-gradient(to right, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 75%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 );}

/* lineup */
#lineupSPmenu {display: none;}
#spmenu {z-index: 9;position: absolute;top: 47px;width: 100%;min-width: 1024px;margin: 0 auto;}
#lineupContmenu {width: 680px;margin: 0 auto;}
#lineupContmenu li {float: left;width: 105px;font-size: 14px;text-align: center;}
#lineupContmenu li.lineup {margin-left: 260px;}
#lineupContmenu li.column {float: right;}

#lineupContmenu li a {display: block;color: #9a9a9a;text-align: center;vertical-align: middle;font-family: 'EB Garamond', serif;}
.top #lineupContmenu li.top a,
.lineup #lineupContmenu li.lineup a,
.concept #lineupContmenu li.concept a,
.column #lineupContmenu li.column a,
#lineupContmenu li a:hover {color: #8b001d;}

/*
#lineuptop {height: 505px;position: relative;background: url(img/lineupbg.jpg) no-repeat 50% 50%;background-size: 100% auto;}
*/
#lineuptop .wrap {position: relative;width: 1024px;margin: 0 auto;}
#lineuptitle {position: absolute;top: 160px;left: 350px;width: 324px;height: 336px;background: url(img/titlebg.png) no-repeat 0 0;text-align: center;}

#lineuptitle h1, #lineuptitle p {text-align: center;}
#lineuptitle h1 {padding-top: 146px;font-size: 28px;font-weight: normal;font-family: 'EB Garamond', serif;}
#lineuptitle p {padding-top: 15px;font-size: 12px;}

/* */
.toparea {height: 453px;position: relative;}
.toparea .wrap {position: relative;width: 1024px;margin: 0 auto;}
#toptitle {position: absolute;top: 56px;left: 350px;width: 324px;height: 336px;background: url(img/titlebg.png) no-repeat 0 0;text-align: center;}
.toparea #titlelogo {top: -88px;}

#lettertop {background: url(img/columnbg.jpg) no-repeat 50% 50%;background-size: cover;}
#concepttop {background: url(img/conceptbg.jpg) no-repeat 50% 50%;background-size: cover;}

#toptitle h1, #toptitle {text-align: center;}
#toptitle h1 {padding-top: 146px;font-size: 28px;font-weight: normal;font-family: 'EB Garamond', serif;}
#toptitle p {padding-top: 15px;font-size: 12px;}

#letterbody {clear: both;position: relative;margin-top: -53px;}
#letternavi {height: 53px;}
#letternavi ul {float: left;}
#letternavi .wrap {width: 950px;margin: 0 auto;}

#letternavi li,
#letternavi p.title {width: 177px;height: 43px;overflow: hidden;margin-top: 10px;margin-right: 10px;font-size: 16px;line-height: 43px;}
#letternavi li small,
#letternavi p.title small{font-size: 12px;}
#letternavi .bklist {margin-top: 10px;}

#letterbody .read {margin-top: 50px;}
#letterbody .title {margin-top: 16px;font-size: 28px;}
#letterbody .caption {margin-top: 1em;font-size: 12px;}
#letterbody .photo {width: 800px;margin: 50px auto 0 auto;}
#letterbody .photo img {width: 100%;height: auto;}
#letterbody .textarea {width: 600px;margin: 0 auto;}
#letterbody .textarea p {margin-top: 2em;}
#letterbody .textarea p.textname {margin-top: 3em;font-size: 12px;}

.columnarea {padding-bottom: 45px;}

#letternavi .bklist {float: right;}
#bknavi {width: 800px;height: 98px;margin: 0 auto;}
#bknavi .bklist {float: left;width: 520px;padding-top: 20px;text-align: center;}
#bknavi ul {width: 800px;margin: 0 auto;}
#bknavi li {width: 140px;font-size: 14px;}
#bknavi li:last-child {text-align:right;}

.panellink .intext {width: 954px;margin: 0 auto;}
.panellink p.link {width: 175px;padding-top: 127px;font-size: 42px;text-shadow:0 0 10px #FFF;}
.panellink p.link a {background: url(img/a.png) no-repeat 100% 60%;background-size: 8px 22px;}
.panellink p.note {padding-top: 10px;font-size: 12px;}
.panellink p.read {padding-top: 44px;font-size: 14px;}

#lineuplist {margin: 1024;margin: 0 auto;padding: 80px 0 0 0;}
#lineuplist p.read {font-size: 14px;text-align: center;}

#lineuplist ul {width: 990px;margin: 0 auto;padding-top: 60px;}
#lineuplist .list li {float: left;width: 210px;margin: 0 15px;}
#lineuplist .list li dt {height: 275px;background: url(img/lineuplistbg.png) no-repeat 50% 50%;background-size: 210px 240px;text-align: center;}
#lineuplist .list li dt img {width: 166px;}
#lineuplist .list li dd.title {padding-top: 14px;font-size: 20px;text-align: center;}
#lineuplist .list li dd.text {padding-top: 22px;font-size: 14px;line-height: 1.8;}

#lineuplist .link {clear: both;width: 100%px;margin: 0 auto;padding-bottom: 50px;text-align: center;}
#lineuplist .link li {display: inline-block;width: 256px;padding: 0 32px;}

#conceptbody {clear: both;position: relative;top: 148px;margin-bottom: 236px;}
p.topread {position: absolute;top: 330px;left: 20px;font-size: 24px;line-height: 1.5;}

.readbox {position: relative;width: 1024px;margin: 0 auto;}
.readbox p {position: absolute;top: -460px;right: 30px;font-size: 14px;line-height: 1.8em;}

.sct {width: 1024px;margin: 0 auto;}
.sct .mainimage img {position: absolute;}
.scthead {padding-bottom: 48px;}
.sct .title {font-size: 60px;}
.sct .read {padding-top: 26px;font-size: 18px;line-height: 1.8;}

.hidebox {font-size: 14px;}
.hidebox p {width: 400px;font-size: 14px;line-height: 2em;}
.hidebox p .caption {font-size: 12px;}
.hidebox p.hideboxlink {padding-top: 0.5em;font-size: 18px;}

.hidebox_nav {width: 400px;}
.hidebox .follow {padding-top: 1em;}
.hidebox .left {float: left;padding-top: 0.5em;}
.hidebox .right {float: left;margin-left: 45px;padding-top: 0.5em;}

.hidebox p.mtop {padding-top: 3em;padding-bottom: 0.5em;}

.sct {padding-bottom: 30px;}
.hidebox_nav {bottom: 75px;}

.type1 .mainimage img {left: -128px;}
.type1 .scthead {padding-left: 584px;}
.type1 .hidebox_nav {right: 40px;}

.type1 .hidebox .top {float: right;width: 400px;margin-right: 40px;}
.type1 .hidebox .subimage {float: left;padding: 226px 0 0 142px;}

.type2 .mainimage img {right: -128px;}
.type2 .scthead {padding-left: 40px;}
.type2 .hidebox_nav {left: 40px;}
.type2 .hidebox .top,
.type2 .hidebox .follow {padding: 0 40px;}

#section4 .top {padding-bottom: 40px;}
#section6 .top {float: left;}
#section6 .follow {padding: 209px 0 0 0;float: left;}

.snsarea {width: 1024px;margin: 0 auto;padding: 20px 0;}
}

@media screen and (min-width: 798px) and (max-width: 1280px) {
#lineuptop {height: 505px;position: relative;background: url(img/lineupbg.jpg) no-repeat 50% 50%;background-size: 100% auto;}
}

@media only screen and (max-width: 768px) {
/* SP */
.br_SP {display: inline;} .br_PC {display: none;}
#topimage {position: relative;height: 559px;border-bottoom: 1px solid #EEE;background: #FFF url(img/topbg.png) no-repeat 50% -136px;}
#pagescroll {position: absolute;left: 50%;bottom: 0;width: 88px;height: 60px;overflow: hidden;margin-left: -44px;text-indent: -9999px;background: url(img/scroll.png) no-repeat 0 0;background-size: 88px 60px;cursor: pointer;}

#titlelogo {width: 170px;margin: 0 auto;}
#titlelogo img {width: 170px;}

#bottle {position: absolute;bottom: 0;left: 50%;width: 119px;margin-left: -60px;}
#bottle img {width: 119px;}

#toptext {position: absolute;top: 152px;right: 32px;width: 57px;}
#toptext img {width: 57px;}

#badge {position: absolute;top: 120px;left: 22px;width: 116px;}
#badge img {width: 116px;}

.headSP #lineupSPmenuClose {display: none;}

#conceptLink {border-top: 1px solid #EEE;background: #FFF url(img/topconceptbg.jpg) no-repeat center bottom;background-size: cover;}
#lineupLink {background: #FFF url(img/lineupbg.jpg) no-repeat center bottom;background-size: 110% auto;}
#columnLink {background: #FFF url(img/topcolumnbg.jpg) no-repeat center 0;background-size: 150% auto;}

.panellink .wrap {height: 319px;
background: -moz-linear-gradient(top, rgba(255,255,255,1) 20%, rgba(255,255,255,0) 50%);
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 20%,rgba(255,255,255,0) 50%);
background: linear-gradient(to bottom, rgba(255,255,255,1) 20%,rgba(255,255,255,0) 50%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffffff',GradientType=0 );
}

#columnLink .wrap {
background: -moz-linear-gradient(top, rgba(255,255,255,1) 8%, rgba(251,253,254,1) 10%, rgba(125,185,232,0) 80%);
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 8%,rgba(251,253,254,1) 10%,rgba(125,185,232,0) 80%);
background: linear-gradient(to bottom, rgba(255,255,255,1) 8%,rgba(251,253,254,1) 10%,rgba(125,185,232,0) 80%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#007db9e8',GradientType=0 );
}


/* lineup */
#lineupSPmenu {display: block;z-index: 8;position: absolute;top: 70px;right: 12px;width: 53px;height: 57px;background: url(img/sp_menu.png) no-repeat 50% 50%;background-size: 53px 57px;}
#lineupSPmenu li {position: absolute;top: 0;right: 0;display: block;width: 53px;height: 57px;overflow: hidden;text-indent: -999px;cursor: pointer;}

#lineupSPmenuOpen {background: url(img/sp_open.png) no-repeat 50% 50%;background-size: 53px 57px;}
#lineupSPmenuClose {background: url(img/sp_close.png) no-repeat 50% 50%;background-size: 53px 57px;}

#spmenu.open {display: block;}
#spmenu.close {display: none;}

#spmenu {position: relative;display: none;}

#lineupContmenu {z-index: 7;position: absolute;top: 0;width: 100%;background: rgba(255,255,255,0.95);padding: 93px 0 23px 0;}
#lineupContmenu li:first-child a {border-top: 1px solid #EEE;}
#lineupContmenu li a {display: block;width: auto;height: 14px;padding: 16px 30px 15px 30px;border-bottom: 1px solid #EEE;text-align: center;}
#lineupContmenu li a:hover,
.top #lineupContmenu li.top a,
.lineup #lineupContmenu li.lineup a,
.concept #lineupContmenu li.concept a,
.column #lineupContmenu li.column a {color: #8b001d;}
/**/

#lineuptop {height: 250px;position: relative;background: url(img/lineupbg.jpg) no-repeat 50% 50%;background-size: 100% auto;}
#lineuptop .wrap {position: relative;}
#lineuptitle {position: absolute;top: 130px;left: 50%;width: 230px;margin-left: -115px;height: 241px;background: url(img/titlebg.png) no-repeat 0 0;background-size: 230px 241px;text-align: center;}
#lineuptitle h1 {padding-top: 96px;font-size: 24px;font-weight: normal;font-family: 'EB Garamond', serif;}
#lineuptitle p {padding-top: 12px;font-size: 11px;}
.panellink .intext {margin: 0 30px;}

.toparea {height: 298px;}
.toparea {position: relative;}
.toparea #titlelogo {position: relative;top: -59px;}

#lettertop {background: url(img/columnbg.jpg) no-repeat 50% 50%;background-size: cover;}
#concepttop {background: url(img/conceptbg.jpg) no-repeat 50% 50%;background-size: cover;}

#letterbody {position: relative;top: 25px;padding-bottom: 55px;}
#letterbody .date {margin-top: auto;}
#letternavi {}
#letternavi .wrap {padding: 0 20px;}

#letternavi li,
#letternavi p.title {width: 48.5%;height: 42px;overflow: hidden;margin-top: 8px;font-size: 14px;line-height: 42px;text-align: middle;}

#letternavi #col3 li, #letternavi #col3 p.title {width: 32%;}

#letternavi li small,
#letternavi p.title small {font-size: 11px;}

#letternavi .bklist {margin-top: 8px;}

#letternavi li:nth-child(1) {float: left;}
#letternavi li:nth-child(2) {float: right;}

#letternavi #col3 li:nth-child(1) {float: left;}
#letternavi #col3 li:nth-child(2) {float: left;margin-left: 2%;}
#letternavi #col3 li:nth-child(3) {float: right;}

#letternavi .bklist {display: none;}

#letterbody .photo {margin: 25px 20px 0 20px;}
#letterbody .caption {margin: 1em 20px 0 20px;}
#letterbody .photo img {width: 100%;height: auto;}

#letterbody .read {margin: 32px 20px 32px 20px;}
#letterbody .title {margin: 20px 20px 0 20px;font-size: 18px;}
#letterbody .caption {font-size: 11px;}
#letterbody .textarea {margin: 0 20px;}
#letterbody .textarea p {padding-top: 2em;}
#letterbody .textarea p.textname {font-size: 11px;}

.columnarea {padding-bottom: 46px;}

#toptitle {position: absolute;top: 20px;left: 50%;width: 230px;margin-left: -115px;height: 241px;background: url(img/titlebg.png) no-repeat 0 0;background-size: 230px 241px;text-align: center;}
#toptitle h1 {padding-top: 96px;font-size: 24px;font-weight: normal;font-family: 'EB Garamond', serif;}
#toptitle p {padding-top: 12px;font-size: 11px;}

#bknavi:after {content: ".";display: block;clear: both;height: 0;visibility: hidden;}

#bknavi ul {padding: 0 20px;}
#bknavi li {padding: 0;font-size: 13px;text-align: center;}
#bknavi li.prev {width: calc(50% - 1px);border-right: 1px solid #EEE;}
#bknavi li.next {width: 50%;}
.bklist {clear: both;border-top: 1px solid #EEE;padding: 9px 0;text-align: center;}

/* */
#lineuplist {padding-top: 110px;}
#lineuplist p.read {font-size: 14px;line-height: 1.6;text-align: center;}
#lineuplist ul {margin: 0 30px;padding-top: 6px;}
.panellink p.link {padding-top: 29px;font-size: 28px;}
.panellink p.link a {background: url(img/a.png) no-repeat 100% 80%;background-size: 7px 21px;}
.panellink p.note {padding-top: 9px;font-size: 10px;}
.panellink p.read {padding-top: 17px;font-size: 13px;}

#lineuplist .list li dt {height: 330px;margin-top: 30px;background: url(img/lineuplistbg.png) no-repeat 50% 50%;background-size: 255px 291px;text-align: center;}
#lineuplist .list li dt img {width: 200px;}
#lineuplist .list li dd.title {padding: 14px 0 0 0;font-size: 18px;text-align: center;}
#lineuplist .list li dd.text {padding: 22px 0 40px 0;font-size: 14px;line-height: 1.8;}
#lineuplist .link {margin: 0 48px;padding-bottom: 30px;}
#lineuplist .link li {padding-bottom: 20px;}

#conceptbody {clear: both;}
p.topread {position: absolute;top: 235px;width: 100%;font-size: 16px;line-height: 1.5;text-align: center;}

.readbox {padding: 80px 20px 20px 20px;}
.readbox p {font-size: 12px;line-height: 2;font-family: YuGothic, 'Yu Gothic', serif;}
.hidebox p .caption {font-size: 11px;}
.hidebox p.hideboxlink {padding-top: 0.5em;font-size: 14px;}

.sct .mainimage {position: relative;width: 100%;height: 375px;overflow: hidden;}
.sct .mainimage img {position: absolute;top: 50%;left: 50%;width: auto;height: 375px;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);}

.scthead {padding: 0 20px 22px 20px;}
.hidebox {padding-right: 20px;padding-left: 20px;}
.sct .title {padding: 20px 0 0 0;font-size: 38px;}
.sct .read {padding: 20px 0 0 0;font-size: 16px;line-height: 1.6;}
.hidebox {font-size: 12px;}
.hidebox p {font-size: 12px;line-height: 2em;font-family: YuGothic, 'Yu Gothic', serif;}
.hidebox .subimage {display: none;}
.hidebox_nav {position: absolute;left: 20px;right: 20px;}
.hidebox .follow p {padding-top: 1em;}
.hidebox .left,
.hidebox .right {padding-top: 0.5em;}

.sct {padding-bottom: 10px;}
.hidebox_nav {bottom: 40px;}

.snsarea {padding: 20px;}

#campaignLink p {width:100%;margin:25px auto 0;}
#cbanner a {height: 95px;padding-top: 35px;font-size: 20px;line-height: 1.5;} /*2017.11*/

#topBtn {
  flex-flow: column;
  margin: 25px auto 0px;
}
#topBtn a {
  margin: 0 20px 20px;
  border-radius: 60px;
}
#topBtn a span {
  padding: 0px 35px;
  min-width: auto;
}
#topBtn a small {
  font-size: 0.7rem;;
}

#footBtn {
  flex-flow: column;
  margin: 5px auto 20px;
}
#footBtn a {
  margin: 0 20px 20px;
  border-radius: 60px;
}
#footBtn a span {
  padding: 0px 35px;
  min-width: auto;
}
#footBtn a small {
  font-size: 0.7rem;;
}

}

@media only screen and (max-width: 400px) {
#cbanner a {display: table-cell;width: 360px;padding: 0;vertical-align: middle;font-size: 4.8vw;} /*2017.11*/
}


/*2019.12 up*/
#topimage.new_img {
	background-image:url(img/topbg_hd.png), url(img/topbg.jpg);
	background-repeat:no-repeat, no-repeat;
	background-position: 0 0, 50% 0;
	background-size: 100% 200px, cover;
	height:640px;
}
.new_img #toptext {
	width:800px;
}
.new_img #toptext img {
	width:90px;
}

#titletext {z-index: 3;position: absolute;top: 200px;left: 20%;width: 350px;margin-left: -126px;}
#titletext img {width: 350px;height: auto;}


@media only screen and (max-width: 768px) {
/* SP */
#topimage.new_img {
	background: url(img/topbg.jpg) no-repeat 50% 0;
	background-size: cover;
	height:500px;
}
.new_img #toptext img {
	width:70px;
}
.new_img #toptext {position: absolute;top: 152px;right: 32px;width: 57px;}
#titletext {width: 170px;margin: 0 auto;left: 5%; top:150px;}
#titletext img {width: 170px;}

}