@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: #444444; padding-bottom: 160px;}
main h2 small {font-size: 25px;}

#sec01 h2,
#sec02 h2{margin: 80px 0 68px;}

.products {padding: 0;}
.products + .products {margin-top: 120px;}
.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: 48px 58px 45px 58px; position: relative; z-index: 10;}
.products .inner:after{content: ''; background: url(../images/index/ornament-left.png); width: 176px; height: 120px; position: absolute; left: -18px; top: -26px; clear: both; zoom:1;}
.products .inner:before{content: ''; background: url(../images/index/ornament-right.png); width: 206px; height: 140px; position: absolute; right: -23px; bottom: -40px;}
.products .inner h2 {text-align: left;}
.products .inner h3 {font-size: 22px; line-height: 35px; margin-bottom: 25px;}
.products .inner h3 b {width: 106px; display: inline-block; color: #fff; background: #c75e8b; text-align: center; margin: 0 21px 0 0; letter-spacing: 0.1em;}
.products .inner p {font-size: 15px; line-height: 26px; position: relative; z-index: 20;}
.products .inner p strong {color: #c75e8b;}
.products .inner p + dl {margin: 33px 0 0;}

.products .inner h2.gradation{margin-bottom: 49px;}
.products .inner h2.gradation:after{content: ''; background: url(../images/artist/h2-line.png) right bottom no-repeat; height: 108px; position: absolute; left: 50%; bottom: -42px; margin-left: -505px; width: 1050px; z-index: -1;}
.products .inner h2.gradation em {display: inline-block; padding: 22px 10px 10px 0; position: relative; top: 0px;}
.products.lefttitle .inner h2.gradation:after{margin-left: -540px; width: 580px;}

/*KTG*/
.products .inner p.buyguide {margin: 30px 0 0; clear: both;}
.products .buyguide img {width: 360px; height: auto;}
.products .buyguide a{transition: 0.3s;}
.products .buyguide a:hover {opacity: 0.7;}

.products dl {padding:0; color: #444; font-size: 14px; line-height: 26px; position: relative; z-index: 100;}
.products dl dt {text-align: center; clear: both; float: left; margin: 0 0 10px; position: relative; top: 0; color: #444; padding: 0 10px;
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 */}
.products dl dd {zoom:1; overflow: hidden; padding: 0 0 0 20px; margin: 0; letter-spacing: 0.05em; min-height: 38px;}
.products dl dd strong {display: block; color: #a15982;}
.products dl dd br + strong {margin-top: 28px;}
.products dl dd a {color: #c75e8b; text-decoration: underline;}
.products dl dd a:hover {text-decoration: none;}

.products figure{ float: right; padding: 0 0 25px 35px; position: relative; z-index: 100;}

#sec01.products figure::after{display: block; content: ''; background: url(../images/artist/chara01.png) left top no-repeat; width: 480px; height: 670px; position: absolute; right: -130px; top: -232px; z-index: -1;}
#sec01.products .inner {padding-top: 68px;}
#sec01.products dl {clear: both; font-size: 16px; line-height: 36px;}
#sec01.products dl dt {width: 145px;color: #c75e8b; font-weight: bold; line-height: 27px; top: 6px;}
#sec01.products figure {padding-right: 155px;}
#sec01.products .inner p {font-size: 16px; line-height: 30px;}

#sec02.products .inner {padding-top: 68px;}
#sec02.products dl {clear: both; font-size: 16px; line-height: 36px;}
#sec02.products dl dt {width: 145px;color: #c75e8b; font-weight: bold; line-height: 27px; top: 6px;}
#sec02.products figure {padding:0 35px 25px 155px; float: left;}
#sec02.products .inner p {font-size: 16px; line-height: 30px;}
#sec02.products figure::after{display: block; content: ''; background: url(../images/artist/chara02.png) left top no-repeat; width: 539px; height: 694px; position: absolute; left: -153px; top: -265px; z-index: -1;}

#sec03.products dl {zoom:1; overflow: hidden;}
#sec03.products figure {padding:0 16px 25px 0; float: left; margin-left: -12px;}
#sec03.products .inner {min-height: 583px;}

#sec04.products dl {zoom:1; overflow: hidden;}
#sec04.products figure {padding:0 0 25px 35px; margin-right: -27px;}
#sec04.products .inner {min-height: 583px;}
#sec04.products dl dt {width: 210px;}

#sec05.products dl {zoom:1; overflow: hidden;}
#sec05.products figure {padding:0 16px 25px 0; float: left;}
#sec05.products .inner {min-height: 583px;}
#sec05.products dl dt {width: 256px;}

#sec06.products dl {zoom:1; overflow: hidden;}
#sec06.products figure {padding:0 0 25px 35px; margin-right: -27px;}
#sec06.products .inner {min-height: 583px;}
#sec06.products dl dt {width: 245px;}

#sec07.products dl {zoom:1; overflow: hidden;}
#sec07.products figure {padding:0 16px 25px 0; float: left;}
#sec07.products .inner {min-height: 730px;}
#sec07.products dl dt {width: 256px;}

#sec08.products dl {zoom:1; overflow: hidden;}
#sec08.products figure {padding:0 0 25px 35px; margin-right: -27px;}
#sec08.products .inner {min-height: 583px;}
#sec08.products dl dt {width: 245px;}

#sec09.products dl {zoom:1; overflow: hidden;}
#sec09.products figure {padding:0 16px 25px 0; float: left;}
#sec09.products .inner {min-height: 616px;}
#sec09.products dl dt {width: 230px;}

#sec10.products dl {zoom:1; overflow: hidden;}
#sec10.products figure {padding:0 0 25px 35px; margin-right: -27px;}
#sec10.products .inner {min-height: 583px;}
#sec10.products dl dt {width: 230px;}

#sec11.products dl {zoom:1; overflow: hidden;}
#sec11.products figure {padding:0 16px 25px 0; float: left;}
#sec11.products .inner {min-height: 518px;}
#sec11.products dl dt {width: 206px;}

#sec12.products dl {zoom:1; overflow: hidden;}
#sec12.products figure {padding:0 0 5px 35px; margin-right: -27px;}
#sec12.products .inner {min-height: 583px;}
#sec12.products dl dt {width: 386px;}

}
@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: #444; 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;}

.products {padding: 0; margin: 3.05rem 0 0;}
.products .inner {margin: 0; position: relative; padding: 0 1.5rem 0; text-align: left;}
.products .inner p{font-size: 1rem; line-height: 1.8rem;}
.products .inner p strong {color: #c75e8b;}

.products dl.about {font-size: 0.9rem; line-height: 1.3rem; padding: 1.85rem 1.5rem 1.35rem; background: rgba(255,255,255,0.8); margin: 0 -1.5rem; position: relative; z-index: 100;}
.products dl.about dt {color: #c75e8b; width: 7.2rem; 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 */}
.products dl.about dd {zoom:1; overflow: hidden; padding: 0 0 0 0.8rem; margin: 0 0 0.5rem; text-align: left; font-size: 0.9rem; line-height: 1.8rem;}

.products dl.links {font-size: 1rem; line-height: 1rem; position: relative; z-index: 100; text-align: center; margin-bottom: -1.25rem; margin-top: 2.6rem;}
.products dl.links dt { line-height: 2.1rem;
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 */}
.products dl.links dd {padding: 1rem 0 1.25rem;}
.products dl dd a {color: #c75e8b; text-decoration: underline;}
.products dl dd a:hover {text-decoration: none;}

.products figure {position: relative; z-index: 10;}

.products .inner h2 {margin: 0 -1.5rem 2.43rem;}
.products .inner h2 em {display: block; padding: 0 1rem 1rem; position: relative; top: 1rem;}

.products .inner h3 {font-size: 1.3rem; line-height: 2.1rem; margin-bottom: 2.1rem;}
.products .inner h3 b {width: 6.15rem; display: inline-block; color: #fff; background: #c75e8b; text-align: center; margin: 0 0.75rem 0 0; letter-spacing: 0.1em;}
.products .inner p strong {color: #c75e8b;}

.products .inner img {margin: 0 0 0.7rem 2.15rem; width: 25.25rem;}


#sec01 {padding: 2.7rem 0 2rem;}
#sec01.products .inner p{font-size: 1.1rem; line-height: 2rem;}
#sec01 img {margin: 10rem 0 3.5rem 1.75rem; display: block; width: 12.5rem;}
#sec01 figure::after{display: block; content: ''; background: url(../images/artist/chara01.png) left top no-repeat; width: 24rem; height: 33.5rem; position: absolute; right: -14.15rem; top: 0.72rem; z-index: -1; background-size: 100% auto;}

#sec02 {margin: 2.5rem 0 0;}
#sec02.products .inner p{font-size: 1.1rem; line-height: 2rem;}
#sec02 img {margin: 10rem 0 3.5rem 14rem; display: block; width: 12.5rem;}
#sec02 figure::after{display: block; content: ''; background: url(../images/artist/chara02.png) left top no-repeat; width: 27rem; height: 34.7rem; position: absolute; right: 1rem; top: 0.2rem; z-index: -1; background-size: 100% auto;}

/*KTG*/
.products .inner p.buyguide {margin: 2.1rem 0 0; clear: both;}
.products .buyguide img.buy {width: 25.4rem!important; height: auto; margin: 0 auto!important;}





}

