@charset "utf-8";

@media screen and (min-width:641px){

#siteheader nav ul li:nth-child(7) a:after {background-position: -1048px -185px; opacity: 1;}

main {background: url(../images/special/bg.jpg) center top no-repeat fixed; color: #502555; padding-bottom: 160px;}
main h2 small {font-size: 25px;}

main .shoplist{display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; font-size: 0; line-height: 1;}
main .shoplist + .shoplist {margin-top: 70px;}
main .shoplist .shop {width: 355px; text-align: center; margin: 0 13px; position: relative; left: 2px;}
main .shoplist .shop:nth-child(n+4) {margin-top: 70px;}
main .shoplist .shop figure {width: 355px; height: 459px; padding: 21px 0 0 17px; position: relative; text-align: left;}
main .shoplist .shop figure:after {content: ''; background: url(../images/special/img-shoplist.png) center center no-repeat; position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
main .shoplist .shop a {display: block; position: relative;}
main .shoplist .shop a figure:after {display: none;}
main .shoplist .shop h3 {color: #502555; font-size: 20px; margin-bottom: 11px;}
main .shoplist .shop h3 + a:after {content: ''; background: url(../images/special/img-shoplist.png) center center no-repeat; width: 355px; height: 459px; position: absolute; left: 0; top: 0;}
main .shoplist .shop h3 + a:before {content: ''; background: url(../images/common/btn-zoom.png) left center no-repeat; width: 30px; height: 30px; position: absolute; right: 20px; bottom: 17px; z-index: 10; background-size: 30px 30px;}
main .shoplist .shop h3 + a:hover img {opacity: 0.8;}
main .shoplist .shop figure img {width: 317px; height: 421px; transition: 0.4s;}
main .shoplist .shop p img {width: 100%; height: auto;}
main .shoplist .shop figure + p,
main .shoplist .shop a + p {font-size: 18px; color: #cb5a72; display: flex; justify-content: center; align-items: center; height: 88px; line-height: 26px; margin: -10px 0 0; font-weight: bold;}
main .shoplist .shop p small {font-size: 16px;}
main .shoplist .shop p.yoyaku a {width: 280px; display: inline-block; margin: 0 auto;}
main .shoplist .shop p.yoyaku a img {transition: 0.4s;}
main .shoplist .shop p.yoyaku a:hover img {opacity: 0.7;}

main .shoplist.ssize .shop {width: 292px; margin: 0 0; position: relative; left: 0;}
main .shoplist.ssize .shop:nth-child(n+4) {margin-top: 0;}
main .shoplist.ssize .shop:nth-child(n+5) {margin-top: 88px;}
main .shoplist.ssize .shop figure{ width: 292px; height: 382px; padding: 19px 0 0 14px;}
main .shoplist.ssize .shop figure:after {background-size: 100% auto;}
main .shoplist.ssize .shop h3 {font-size: 17px; margin-bottom: 13px;}
main .shoplist.ssize .shop h3 + a:after {background-size: 100% auto; width: 292px; height: 382px;}
main .shoplist.ssize .shop h3 + a:before {width: 27px; height: 27px; position: absolute; right: 17px; bottom: 14px; background-size: 27px 27px;}
main .shoplist.ssize .shop h3 + a:hover img {opacity: 0.8;}
main .shoplist.ssize .shop figure img {width: 261px; height: 348px;}
main .shoplist.ssize .shop figure + p,
main .shoplist.ssize .shop a + p {font-size: 15px; display: block; height: auto; min-height: 70px; line-height: 22px; margin: 0; padding: 8px 0 ;}
main .shoplist.ssize .shop p small {font-size: 15px;}
main .shoplist.ssize .shop p small small {font-size: 12px;}
main .shoplist.ssize .shop p.yoyaku a {width: 216px; display: inline-block; margin: 0 auto;}

#sec01 h2 {margin: 80px 0 63px;}
#sec01 img { float:left; margin-left:-10px;}
#sec01 dl.spec {float: right; font-size: 16px; line-height: 36px; padding: 0 0 0 0px; margin-top: 18px; width: 760px; color: #444;}
#sec01 dl.spec dt {color: #a15982; width: 208px; text-align: center; float: left; margin: 0px 0 0; line-height: 26px; position: relative; top: 6px;
background: #d0cedf; /* Old browsers */
background: -moz-linear-gradient(left, #d0cedf 0%, #f3f3f0 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #d0cedf 0%,#f3f3f0 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #d0cedf 0%,#f3f3f0 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d0cedf', endColorstr='#f3f3f0',GradientType=1 ); /* IE6-9 */}
#sec01 dl.spec dd {zoom:1; overflow: hidden; padding: 0 0 0 20px; margin: 0px 0 0; letter-spacing: 0.05em;}
#sec01 dl.spec dd strong {display: block; color: #a15982;}
#sec01 dl.spec dd br + strong {margin-top: 28px;}

#sec01 .price ul.note {}
#sec01 .price ul.note li {font-size: 12px;}


#sec02 {padding: 62px 0 63px;}
#sec02 h2 {z-index: 10;}
.ie11 #sec02 h2 {height: 50px;}
#sec02 .inner {margin: -5px 0 0;border: 1px solid #c5c5c5; background: url(../images/special/img-dlc01.png) center 210px no-repeat rgba(255,255,255,0.9); text-align: left; position: relative; padding: 64px 0 47px 40px; min-height: 1006px; z-index: 0;}
#sec02 .inner:after{content: ''; background: url(../images/index/ornament-left.png); width: 176px; height: 120px; position: absolute; left: -18px; top: -26px;}
#sec02 .inner:before{content: ''; background: url(../images/index/ornament-right.png); width: 206px; height: 140px; position: absolute; right: -23px; bottom: -40px;}
#sec02 p.head {background: url(../images/special/dlc-ornament.png) center top no-repeat; height: 217px; padding:45px 0 0; width: 499px;}
#sec02 p.head strong {display: block; font-size: 42px;  color: #991658; line-height: 1; font-family:'Kozuka Mincho Pro', 'Kozuka Mincho Std', '小塚明朝 Pro R', '小塚明朝 Std R', 游明朝, YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E',  HG明朝E, 'HGS明朝E',  HGS明朝E, 'ＭＳ Ｐ明朝', 'ＭＳ 明朝', 'MS PMincho', serif; text-align: center;}
#sec02 p.head strong em {font-weight: bold; background: -webkit-linear-gradient(-90deg, rgba(182,17,89,1) 0%,rgba(80,36,84,1) 100%); -webkit-text-fill-color: transparent; -webkit-background-clip: text; font-style: italic; position: relative;}
#sec02 p.head + p {position: absolute; left: 566px; top: 70px; font-size: 16px; line-height: 26px; padding-right: 65px; letter-spacing: 0.05em;}
#sec02 p.head + p strong {color: #a15982;}
#sec02 .inner ul.note { margin-left: 100px;}
#sec02 .inner ul.note li {font-size: 14px;}
#sec02.new .wrap:after{content: ''; width: 127px; height: 127px; background: url(../images/common/new.png) left top no-repeat; position: absolute; right: 45px; top: 310px; z-index: 100;}


.products {padding: 0 0 0px;}
.products h2 {z-index: 10;}
.products .inner {margin: -10px 0 0;border: 1px solid #c5c5c5; background: rgba(255,255,255,0.9); text-align: left; position: relative; padding: 64px 0 47px 58px; min-height: 590px; position: relative; z-index: 0;}
.products .inner:after{content: ''; background: url(../images/index/ornament-left.png); width: 176px; height: 120px; position: absolute; left: -18px; top: -26px;}
.products .inner:before{content: ''; background: url(../images/index/ornament-right.png); width: 206px; height: 140px; position: absolute; right: -23px; bottom: -40px;}
.products .inner dl dt {display: inline-block; color: #cb5a72; float: left; width: 10em;}
.products .inner dl dd {zoom:1; overflow: hidden;}
.products .inner .img {position: absolute; right: 0; top: 0;}
.products .inner dl + p {margin: 20px 0 0; clear: both;}
.products .inner p.buyguide {margin: 30px 0 0; clear: both;}
.products .inner ul.note {margin-top: 20px;}
.products .inner ul.note li {font-size: 14px;  line-height: 24px;}
.products .inner.premiumbox {min-height: 578px;}
.products .inner.premiumbox .img {right: 10px; top: 20px;}
.products .inner.gallery20th {min-height: 660px;}
.products .inner.gallery20th  .img {right: 32px; top: 32px;}
.products .buyguide img {width: 360px; height: auto;}
.products .buyguide a{transition: 0.3s;}
.products .buyguide a:hover {opacity: 0.7;}

.products p.movie a:hover {opacity: 0.7;}
.products p.movie {text-align: center; padding-bottom: 40px;}
.products p.movie img {width: 400px; height: auto;}

.products p.txt{ text-align:center; padding-bottom:40px;}
.products .inner ul.txt{ text-align:left; margin-left:1em; width:480px; padding-top:20px;}
.products .inner ul.txt li{text-indent:-1.0em; font-size: 14px; padding-bottom:10px;}
.products .inner ul.txt li strong{font-size: 16px;  color: #cb5a72;}

#sec03{margin-bottom: 67px;}
#sec03.products .inner .img {top: 40px; right: 11px;}
#sec04 {margin-bottom: 90px;}
#sec04.products .inner {min-height: 660px;}
#sec04.products .inner .img {top: 32px; right: 32px;}

h2.gradation .margin-top{ margin-top:-17px;}

}
@media screen and (min-width:1401px){}
@media screen and (min-width:1920px){main {background-size: 100% auto;}}




@media screen and (max-width:640px){


main { color: #502555; padding-bottom: 5.5rem;}
main:before {content: ''; width: 100%; height: 100%; background: url(../images/special/sp/bg.jpg) center -1.2rem no-repeat ; background-size: 100% auto; position: fixed; left: 0; top: 0; z-index: -1;}
main h2 small {font-size: 1.1rem;}

main .shoplist {font-size: 0; line-height: 1; text-align: center;}

main .shoplist .shop {width: 19.4rem; text-align: center; margin: 0 auto; position: relative; left: 0;}
main .shoplist .shop + .shop {margin-top: 3rem;}
main .shoplist .shop figure {width: 19.4rem; height: 25rem; padding: 1.2rem 0 0 0.95rem; position: relative; text-align: left;}
main .shoplist .shop figure:after {content: ''; background: url(../images/special/img-shoplist.png) center center no-repeat; position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
main .shoplist .shop a {display: block; position: relative;}
main .shoplist .shop a figure:after {display: none;}
main .shoplist .shop h3 {color: #502555; font-size: 1.2rem; margin-bottom: 1.4rem;}
main .shoplist .shop h3 + a:after {content: ''; background: url(../images/special/img-shoplist.png) center center no-repeat; width: 19.4rem; height: 25rem; position: absolute; left: 0; top: 0; background-size: 100% auto;}
main .shoplist .shop h3 + a:before {content: ''; background: url(../images/common/btn-zoom.png) left center no-repeat; width: 2.5rem; height: 2.5rem; position: absolute; right: 1.05rem; bottom: 0.8rem; z-index: 10; background-size: 100% auto;}

main .shoplist .shop figure img {width: 17.3rem; height: 22.95rem;}
main .shoplist .shop p img {width: 100%; height: auto;}
main .shoplist .shop figure + p,
main .shoplist .shop a + p {font-size: 1.1rem; color: #cb5a72; display: flex; justify-content: center; align-items: center; height: 4rem; line-height: 1.4rem; margin: -0.5rem 0 0; font-weight: bold;}
main .shoplist .shop p small {font-size: 0.95rem;}
main .shoplist .shop p.yoyaku a {width: 18rem; display: inline-block; margin: 0 auto;}

main .shoplist + .shoplist {margin-top: 3.6rem; display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start;}

main .shoplist.ssize .shop {width: 14.85rem; margin: 0 0.15rem;}
main .shoplist.ssize .shop + .shop {margin-top: 0;}
main .shoplist.ssize .shop:nth-child(n+3) {margin-top: 3rem;}
main .shoplist.ssize .shop figure {width: 14.85rem; height: 19.7rem; padding: 1.1rem 0 0 0.65rem;}
main .shoplist.ssize .shop h3 {font-size: 1rem; margin-bottom: 0.4rem;}
main .shoplist.ssize .shop figure:after,
main .shoplist.ssize .shop h3 + a:after {width: 14.85rem; height: 19.7rem; background-size: 100% auto;}
main .shoplist.ssize .shop h3 + a:before {width: 1.9rem; height: 1.9rem; right: 0.75rem; bottom: 0.8rem;}
main .shoplist.ssize .shop figure img {width: 13.35rem; height: 17.65rem;}
main .shoplist.ssize .shop figure + p,
main .shoplist.ssize .shop a + p {font-size: 0.9rem; line-height: 1.1rem; display: block; margin: -0.4rem 0 0; min-height: 3.4rem; height: auto; padding: 0.4rem 0;}
main .shoplist.ssize .shop p small {font-size: 0.8rem;}
main .shoplist.ssize .shop p.yoyaku a {width: 13.5rem;}
main .shoplist.ssize .shop p small small {font-size: 0.6rem;}

.products {padding: 0;}
.products .inner {margin: 0; position: relative; padding: 1.2rem 1.5rem 0; text-align: center;}
.products .inner dl {font-size: 1.12rem; line-height:2rem; margin-bottom: 0rem; text-align: left;}
.products .inner dl dt {display: inline-block; color: #cb5a72; float: left; width: 10em;}
.products .inner dl dd {}
.products .inner dl + p {margin:0; clear: both; font-size: 1.12rem; line-height: 1.82rem; position: relative;  padding: 1.2rem 0 0; text-align: left;}
.products .inner p.buyguide {margin: 2.1rem 0 0; clear: both;}
.products .inner .img{display: inline-block; margin: 1.6rem -1.5rem 0; width: 32rem; height: auto;}
.products .buyguide img {width: 25.4rem; height: auto; margin: 0 auto;}
.products .inner ul.note {margin-top: 0.8rem;}
.products .inner ul.note li {font-size: 1rem;  line-height: 1.5; text-align: left; text-indent: -1em; padding-left: 1em;}
.products p.txt{padding: 1rem 1.5rem;font-size: 1.12rem; text-align:left; line-height:2rem;}
.products .inner ul.txt{ text-align:left; margin-left:1em; padding-top:1.5rem;}
.products .inner ul.txt li{text-indent:-1.0em; font-size: 1rem; line-height:1.7rem; padding-bottom:1rem;}
.products .inner ul.txt li strong{font-size: 1.12rem;  color: #cb5a72;}
.products p.movie {text-align: center; margin: 2.1rem 0 0; clear: both;}
.products p.movie img {width: 25.4rem; height: auto; margin: 0 auto;}

#sec01 {padding: 2.7rem 0 0;}

#sec01 img {margin: 0.8rem auto 2rem; display: block; width: 22rem;}
#sec01 dl.spec {font-size: 0.9rem; line-height: 1.3rem; padding: 0 1.5rem 0;}
#sec01 dl.spec dt {color: #a15982; width: 11.25rem; text-align: center; clear: both; float: left; position: relative; top: 0.25rem;
background: #d0cedf; /* Old browsers */
background: -moz-linear-gradient(left, #d0cedf 0%, #f3f3f0 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #d0cedf 0%,#f3f3f0 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #d0cedf 0%,#f3f3f0 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d0cedf', endColorstr='#f3f3f0',GradientType=1 ); /* IE6-9 */}
#sec01 dl.spec dd {zoom:1; overflow: hidden; padding: 0 0 0 1.3rem; margin: 0; text-align: left; font-size: 0.85rem; line-height: 1.95rem; color: #444;}
#sec01 dl.spec dd.price {display: block; clear: both; padding: 1.5rem 0.8rem;}
#sec01 dl.spec dd.price strong {display: block; width: 16.25rem; background: #f2f2f0; margin: 0 0 0 -0.8rem; text-align: left; padding: 0 0.8rem; line-height: 1.35rem;}
#sec01 dl.spec dd.price br + strong {margin: 1.75rem 0 0;}

#sec01 dl.spec dd.price ul.note {margin: 0 0 1.75rem 0;}
#sec01 dl.spec dd.price ul.note li {}

#sec02 {margin: 2.5rem 0 2.0rem;}
#sec02 p.head {background: url(../images/special/sp/dlc-ornament.png) center top no-repeat; height: 10.9rem; width: 100%; background-size: 100% auto; padding: 2.5rem 0 0; margin: -0.3rem 0 0;}
#sec02 p.head strong {display: block; font-size: 2.1rem;  color: #991658; line-height: 1; font-family:'Kozuka Mincho Pro', 'Kozuka Mincho Std', '小塚明朝 Pro R', '小塚明朝 Std R', 游明朝, YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E',  HG明朝E, 'HGS明朝E',  HGS明朝E, 'ＭＳ Ｐ明朝', 'ＭＳ 明朝', 'MS PMincho', serif; text-align: center;}
#sec02 p.head strong em {font-weight: bold; background: -webkit-linear-gradient(-90deg, rgba(182,17,89,1) 0%,rgba(80,36,84,1) 100%); -webkit-text-fill-color: transparent; -webkit-background-clip: text; font-style: italic; position: relative;}
#sec02.new .wrap:after{content: ''; width: 6.35rem; height: 6.35rem; background: url(../images/common/new.png) left top no-repeat; position: absolute; left: .4rem; top: 8rem; z-index: -1; background-size: 100% auto;}
#sec02 p.head + p {font-size: 1.1rem; line-height: 2.15rem; padding: 1rem 1.5rem 2rem;}
#sec02 img.sp-item {width: 100%; height: auto;}
#sec02 p.head + p strong {color: #a15982;}


#sec03,#sec04 {margin-bottom: 4.5rem;}

h2.gradation .margin-top{ margin-top:-1rem;}

}

/* bugfix */
.ie #sec02 p strong {font-family: 'Noto Serif Japanese', serif;}
.android #sec02 p strong  {font-family: 'Noto Serif Japanese', serif;}