@charset "UTF-8";

/*SP・PC共通*/
/*#BRANDkokuchi .brand-program-reserve,
#Brandarea .brand-program-reserve{display:none;}*/
body {width:100%;padding:0;margin:0; background:#FFF; font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;}
img {width:100%;}
p { font-size:18px;margin: 0; line-height: 1.7; color:#111111;}
p strong {font-weight:bold;}
li {list-style: none;text-indent: 0;}
ul{padding:0;margin: 0;}
a:link,a:visited,a:hover,a:active {color:#222222; text-decoration-style: dotted;} 
.clearfix:after { content:" ";  display:block;  clear:both;  }
.flex{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;}
.text_right{ text-align: right;}
.sp_only { display: block;}
.pc_only { display: none; }
.justify, .copy1, #arc h3, #arc p, #profile .proftxt, #Brandarea p, #Ad p, #arc p#catchcopy {text-align: justify;text-justify: inter-ideograph;-ms-text-justify: inter-ideograph;}
.none,#arc .otherphotos img.none{display:none;}
.serif, h2,#OAkokuchi p.oatime {font-family: "Times New Roman","YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif; font-weight: lighter;}
.sanserif, p strong,.pNotice a, #OAkokuchi, #arc h3
{font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;}
.copy1{padding:15px 20px 20px; font-size:20px;}
.lighter{font-weight: lighter;}
.center{text-align: center;}
.brand-program-reserve { margin-left: auto; margin-right: auto; }
.pNotice a{color:#77b716; font-size:19px;padding:10px 0;}
.bNotice a{color:#e93399; font-size:19px;padding:10px 0;}
.mt20{margin-top:20px;}

.scsColor{ background: #f0efeb;}

.menu {padding: 0 5px 15px; font-size:14px; justify-content: space-between; font-weight:bold; }
.menu a{padding:3px 0px; margin:0 5px; text-decoration: none; border-bottom: #FFF solid 2px;}
.menu a.here{border-bottom: #c19422 solid 3px;}

#logonav {padding:15px 2px 15px 10px;}
#logonav a {display: flex;	align-items: center;box-sizing: border-box;}
#logo_shopchannel {width:15%; animation: poyon 0.5s 0.1s ease-in-out;}
#logo_shopchannelstyle {width:80%;margin-left:15px; }
@keyframes poyon {
  0%   { transform: scale(1.0, 1.0) translate(0%, 0%); }
  15%  { transform: scale(0.9, 0.9) translate(0%, 5%); }
  30%  { transform: scale(1.1, 0.8) translate(0%, 10%); }
  50%  { transform: scale(0.8, 1.1) translate(0%, -10%); }
  70%  { transform: scale(1.1, 0.9) translate(0%, 5%); }
  100% { transform: scale(1.0, 1.0) translate(0%, 0%); }
}



h1 {text-align:center;margin:20px 25px 0;}
h2 { font-size: 40px;  margin: 0;  text-align: center; letter-spacing: 0.1em; margin: 5px 0 20px 0.5em;}

.fukidashi {text-align: center; line-height: 1.3;}
.fukidashi span {background-color:#111111;box-sizing:border-box;padding: 6px 0.5em;color:#fff;display: inline-block; font-size: 18px; margin:0;}
.fukidashi::after { content: ""; width: 0px; height: 0px; border-style: solid;  border-color: #111 transparent transparent transparent;
    border-width: 8px 8px 0 8px; margin: auto;display: block;}

#profile {background: #fcf2db;animation: fadeup 1.5s 0.8s cubic-bezier(0.33, 1, 0.68, 1)  1 forwards; opacity: 0;}
#profile .fukidashi {position:relative;top:-20px;}
#profile h2::after{ content:"さん"; font-size:20px; }
@keyframes fadeup {
  0% {    transform: translateY(35px);
    opacity: 0;
  }
  80% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
#profile h3 {width:30%; margin:0 0 5px;}
#profile p{ background: url(/scstyle/gueststory/img/ttl_profile.png) no-repeat 23px 0; background-size: 106px; padding: 25px 20px 30px; }

#BRANDkokuchi { padding:18px 20px 30px; background: #fdf7e9; border-top:#111111 1px dotted;  }
#BRANDkokuchi .text_right {  text-align: right;top: -40px;position: relative;right: -10px;margin-bottom: -70px; height:84px; }
#BRANDkokuchi img { border: #fcf2db solid 2px;border-radius: 50%;width: 80px;}
#BRANDkokuchi p {text-align: center; font-size: 16px; margin: 0 0 10px;   }
#BRANDkokuchi h4, #OAkokuchi h4 {text-align:center; font-size:20px; margin:0 0 10px; padding:0; font-weight:bold;}
#BRANDkokuchi p.hatena, #OAkokuchi p.hatena  {font-size:95%;text-align:right;margin:1em 0 0 0;} 

.BrandButton.sp_only { text-align:center; }
.BrandButton.sp_only a { display:inline-block; width:90%; border:1px solid #e4007f; box-sizing:border-box; margin:0 auto; border-radius:5px; line-height:1.0; font-size:19px; background-color:#fff; color:#e4007f; padding:14px 0; text-decoration:none; }


#OAkokuchi { padding: 13px 20px 35px; border-top:#111111 1px dotted; background:#fdf7e9;}
#OAkokuchi .text_right {top: -26px;position: relative;right: -10px; }
#OAkokuchi .text_right img{ height:22px; width:auto;}
#OAkokuchi p.OAtime {text-align:center;font-size:30px;line-height:1.2;margin:0 0 5px;font-family: 'Heebo', sans-serif;}
#OAkokuchi p.OAtime span {font-size:20px;}
#OAkokuchi span.kara::after {content: "～";}

#OAkokuchi .OAtableButton.sp_only { text-align:center; padding-top:10px; }
#OAkokuchi .OAtableButton.sp_only a { display:inline-block; width:90%; margin:0 auto; border-radius:5px; line-height:1.0; font-size:19px; background-color:#7fbe26; color:#fff; padding:14px 0; text-decoration:none; }


.showschedule { background-color: #fdf7e9;}

#Releasedate, #Releasedate2{padding:0 20px 0; margin:0; position:relative;}
#Releasedate { top:-26px; background: #fdf7e9;}
#Releasedate2 {top:-30px; background: #FFF;border-top: #111 2px solid;}
#Releasedate li {font-size:16px; background: #FFF; text-align: left; padding:10px 15px; margin:0 3px 0; border-radius: 10px 10px 0 0;
    border-bottom:#fff 1px solid; border-top:#111 2px solid; border-right:#111 2px solid;border-left:#111 2px solid;  position:relative;top:3px; z-index: 50;}
#Releasedate li.backnumber {    border-bottom:#111 2px solid; }
#Releasedate2 li {font-size:16px; background: #fdf7e9; text-align: left; padding:10px 15px; margin:0 3px 0; border-radius: 0 0 10px 10px ;
    border-top:#fdf7e9 1px solid; border-bottom: #111 2px solid; border-right: #111 2px solid;border-left: #111 2px solid;  position:relative;top:-3px; z-index: 50;}
#Releasedate2 li.backnumber {    border-top:#111 2px solid; }

#arc{ background-color:#fff ;padding:0px;  position:relative;top:-26px;border-top:#111 2px solid;} 
#arc h3{ padding: 40px 0 30px 0; font-size:26px;border-top:#111 1px dotted;}
#arc h3:first-child{ border-top:none;}

#arc p{ font-size:20px;padding: 0px 0 0 0; line-height: 1.8;}
#arc p strong {/*background-color: #d7f607; */
position: relative;  background: linear-gradient(transparent 70%, #d7f607 70%);}
#arc p img.icon { float: left; width:20%;margin:0 15px -5px 0;  border-radius: 50%; position:relative; top:-7px; }
#arc p img.arcPhoto { margin: 20px 0 0; display: block;} 
#arc p#catchcopy{text-align: left;
  FONT-SIZE: 30px;
  padding: 40px 0 30px;
  line-height: 45px;
  border-bottom: 1px
  #111 dotted; font-weight:bold;}

.otherphotos {background: #fdf7e9; padding:25px 20px 10px; border-bottom:#111 2px solid;}
.otherphotos img { margin: 0 0 15px;}
.bg_white { background-color: #fff; padding:0 20px 0 20px;}

#Brandarea {padding:0 20px 0;}
#Brandarea h2 img{display:block; margin-bottom: 25px; }
#Brandarea h2 {margin:0 0 15px; font-size:30px;}
#Brandarea .toBtn a { margin:30px 10px; }
#Items {margin:30px 0;}
#Items img {width: 50%;margin: 0;float: left;}
.toBtn a {     border: 1px solid #ccc;background: #fff; font-size: 17px; border-radius: 4px; font-weight: bold; text-align: center; padding:15px 0; text-decoration: none;}
.copy2 { font-size:16px;margin:12px 10px 10px; text-align: center;}
.brand-link { font-size:16px;margin:12px 10px 30px; text-align: center; }
.brand-link a.sp_only { display:inline; }

#Charisma {text-align: center; padding:25px 0; background: #fdebf5; margin:20px 20px 0; border-radius: 10px;}
#Charisma img {width:90%;}
#Charisma p {text-align: left; color:#e93399; font-size:16px; margin:8px 20px 0;}

#Otherguest { margin:60px 0 20px; padding:10px 0 10px; border-top:#111111 1px dotted;}
#Otherguest dl {padding:0 20px; }
#Otherguest dt { font-size: 22px; padding: 0;font-family: 'Nanum Myeongjo', serif; width:64%;  }
#Otherguest dd { text-align: right; width: 36%; top: -3px; position: relative;}
#Otherguest dd a{ border:1px solid #ccc; padding: 4px 10px; display: inline-block; white-space: nowrap; text-decoration: none; border-radius: 3px;}
#Otherguest dd a::after{ content:" >"; font-size:80%; }

#Otherguest ul { overflow-x: auto; white-space: nowrap; margin:10px 0 10px;}
#Otherguest li { display: inline-block; vertical-align: top; width: 36%; min-height: 250px; margin: 0 0 0 10px; font-size: 16px; line-height: 1.4; background-color:#fff;text-align: center;}
#Otherguest li a {text-decoration: none;}
#Otherguest p {text-align: right;}
.otherbrand { font-size:90%; margin-top:10px; white-space: normal; }
.othername{font-weight: bold; margin-top:5px;display: inline-block; white-space: normal;}
.othername::after{ content:"さん"; font-size:70%; }


#Ad{background: #f0efeb; padding:20px;}
#Ad h3 { margin: 20px 0 12px;}
#Ad p{font-size:16px;margin-bottom:20px;}
#Ad p.borderb {border-bottom: #111111 1px dotted; padding-bottom: 25px; margin-bottom:35px;}
#Ad p strong { color:#c19422;}
#Ad .toBtn a { display: block; margin: 0 15px 20px; border:#c19422 solid 2px; color: #c19422; font-weight:bold;}

footer { text-align:center; padding:40px 20px 15px; }
footer p {text-align:left; font-size:14px; margin:0 20px 60px;}
footer ul {text-align: center;}
footer li {  margin-bottom:15px; }
footer li.scs{  font-family: 'Nanum Myeongjo', serif; font-size: 120%;}
footer li.sc{  font-weight:bold;}
footer small {color:#999;}

.pagetop {
  position: fixed;
  right: 30px;
  bottom: 50px;
  z-index: 20;
  display: none;
}
.pagetop a {
  overflow: hidden;
  display: inline-block !important;
  text-indent: 200%;
  white-space: nowrap;
  vertical-align: middle;
  line-height: 1;
  background-image: url("/scstyle/common/totop.png");
  background-repeat: no-repeat;
  width: 44px;
  height: 44px;
  background-size: auto;
  background-position: 0 0;
}



@media screen and (min-width:600px) and (max-width:959px) {
/* タブレット・SP横画面用調整 */
 #logonav { width: 94%; margin-left: auto; margin-right: auto; }
 h1 { width: 85%; margin-left: auto; margin-right: auto; }
 header .clearfix:after { content: none; }
 header .menu { width: 80%; margin-left: auto; margin-right: auto; }
 #Otherguest li { width: 25%; height: auto;}
}


@media screen and (min-width: 960px){
/*表示領域が960px～に適用*/
.w980{ width:980px; margin: 0 auto;}
.pcflex{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
 }

#logonav{width:500px;float:left;}
.menu {float:right; width:450px;margin:20px 0 0; padding: 7px 5px 15px; font-size:16px; }
h1 {width:60%; margin:0 auto ;padding:30px 0 10px; clear:both;}
.copy1{padding:15px 10px 20px; font-size:18px; text-align:center;}

#pc_profile,#BRANDkokuchi{ background-color: #fcf2db; }
#profile img { float:left; width:600px;}
#profile .fukidashi,#profile p,#BRANDkokuchi  {width:380px;float:right; box-sizing: border-box;}
#profile p {padding:30px 20px 30px; font-size:16px;}
#BRANDkokuchi{animation: fadeup 1.5s 0.8s cubic-bezier(0.33, 1, 0.68, 1)  1 forwards; opacity: 0;}

#BRANDkokuchi .BrandButton.pc_only { margin:20px 30px 0; }

.BrandButton.pc_only { text-align:center; }
.BrandButton.pc_only a { display:inline-block; width:100%; border-radius:5px; border:1px solid #e4007f; line-height:1.1; background-color:#fff; color:#e4007f; padding:10px 0; text-decoration:none; }

#profile .fukidashi {    margin-top: 50px;}
.bNotice a, .pNotice a { font-size: 16px; font-weight: normal;  padding: 3px 0;}

#OAkokuchi,#Releasedate { clear:both;}
#OAkokuchi {border:none;}
#OAkokuchi .text_right {width:900px; margin:20px auto 0; text-align: left; top:0;}
#OAkokuchi h4 {padding: 10px 20px 0 0;}
#OAkokuchi .OAtime  {padding:6px 10px 0 0;}
#OAkokuchi .brand-program-reserve{margin:0;}
#OAkokuchi .pcflex{justify-content: center;}
#OAkokuchi p.hatena {width:980px;margin:15px auto 0;z-index: 50;
position: relative;}

#OAkokuchi .OAtableButton.pc_only { display:flex; align-items:center; padding-left:20px; }
#OAkokuchi .OAtableButton.pc_only a { display:inline-block; border-radius:5px; line-height:1.1; background-color:#7fbe26; color:#fff; padding:10px 40px; text-decoration:none; }


#arc p {font-size:17px;padding: 0px 30px 35px 30px;}
#arc h3{ font-size:25px; margin: 0; padding: 40px 30px 30px 30px; border-top: #111111 1px dotted; line-height:1.5; clear: both; font-weight:bold;}
#arc p img.icon{ display:none;}
#arc p#catchcopy{ text-align: center;
  FONT-SIZE: 45px;
  padding: 70px 0 60px;
  line-height: 60px;
  width: 980px;
  margin: 0px auto;}
#Releasedate { width:980px; padding-top: 55px; margin:-70px auto 0; background-color: transparent;  }
#Releasedate li{top:3px;}
#arc .pc_padding { width:980px; margin:0 auto; padding:20px 0 20px;}
#arc img{width:300px; }
#arc p img.arcPhoto {padding:0 0 0 30px; top:-10px;position:relative;}
#arc .otherphotos img { display:inline-block;padding:0 0 0 10px; width:312px;}
#Releasedate2 {width:980px; margin:0 auto; position:relative;top:-28px;}


#Brandarea #Items img { width: 25%;}
#Brandarea h2 img {width: 650px;margin: 10px auto 30px;}
#Brandarea .toBtn { width: 32%; margin-left: auto; margin-right: auto;}
#Brandarea .copy2{ text-align: center; margin:20px 0 20px; }
#Brandarea .brand-link{ text-align: center; margin:20px 0 70px; }
.brand-link a.sp_only { display:none; }
.brand-program-reserve { margin-left: auto; margin-right: auto; }

#Charisma a { width: 400px; margin-left: auto; margin-right: auto;}
#Charisma p { text-align: center; }
#Charisma  {margin:0 auto;}
#Otherguest li { width: 120px; height:240px; min-height: 240px; }

#Ad h3, #Ad p,footer p { text-align: center; }
#Ad img.mt20 { width:300px; display:block; margin: 20px auto;}
#Ad p{text-align: left;}
#Ad p.borderb {border:none;padding-bottom:0px; margin-bottom: 0px;}
#Ad .pc_box {border-right:1px #111 dotted; padding:0 30px 0 0;margin-right:30px;}
#Ad p strong {color:#111;}
.sp_only { display: none; }
.pc_only { display: block; }

}