@charset "utf-8";

.___________________SP-PRODUCTS-COMMON____________________{}

.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX{}
._____products-local-nav_____{}
.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX{}


.PRODUCTS.TOP #page-ttl.large .inner{
 height: 100px;
}

.PRODUCTS.TOP .products-local-nav h1 {
 display: none;
}

._{}

.products-local-nav {
 padding-top: 10px;
 background-color: #f4f4f4;
 overflow: hidden;
}

.products-local-nav .inner {

}

.products-local-nav .x-scroll-inner{
 width: 515px;
 position: relative;
}

.products-local-nav .box-summary{
 overflow: hidden;
}

.products-local-nav .box-summary:nth-of-type(1){
 /*background-color: #13FF3D;*/
 padding-left: 15px;
}

.products-local-nav .box-summary:nth-of-type(2){
 /*background-color: #5218b1;*/
 padding-left: 30px;
}

.products-local-nav .box-summary .box{
 width: 80px;
 float: left;
 padding-top: 76px;
 margin-bottom: 15px;
 position: relative;
}

.products-local-nav .box-summary .box dl dt img{
 height: 10px;
}

.products-local-nav .box-summary .item img{
 height: 70px;
 object-fit: contain;
}

._{}

.products-local-nav .box-summary:nth-of-type(1) .box:nth-of-type(1){
 margin-right: 25px;
 /*background-color: #FF1919;*/
}

.products-local-nav .box-summary:nth-of-type(1) .box:nth-of-type(2){
 margin-right: 30px;
 /*background-color: #FF18E1;*/
}

.products-local-nav .box-summary:nth-of-type(1) .box:nth-of-type(3){
 /*background-color: #A217FF;*/
}

.products-local-nav .box-summary:nth-of-type(1) .box:nth-of-type(4){
 margin-right: 15px;
 /*background-color: #2016FF;*/
}

.products-local-nav .box-summary:nth-of-type(1) .box:nth-of-type(5){
 margin-right: 60px;
 /*background-color: #15B2FF;*/
}

._{}

.products-local-nav .box-summary:nth-of-type(2) .box:nth-of-type(1){
 margin-right: -25px;
 /*background-color: #14FFCF;*/
}

.products-local-nav .box-summary:nth-of-type(2) .box:nth-of-type(1) dl{
 margin-left: -25px;
}

.products-local-nav .box-summary:nth-of-type(2) .box:nth-of-type(2){
 margin-right: 5px;
 /*background-color: #13FF3D;*/
}

.products-local-nav .box-summary:nth-of-type(2) .box:nth-of-type(3){
 margin-right: 20px;
 /*background-color: #99FF12;*/
}

.products-local-nav .box-summary:nth-of-type(2) .box:nth-of-type(4){
 margin-right: -5px;
 /*background-color: #FFEF11;*/
}

.products-local-nav .box-summary:nth-of-type(2) .box:nth-of-type(5){
 margin-right: -30px;
 /*background-color: #FFB310;*/
}

.products-local-nav .box-summary:nth-of-type(2) .box:nth-of-type(6){
 /*background-color: #848484;*/
}

.products-local-nav .box-summary .box:last-of-type{
 margin-right: 0%!important;
}

._{}

.products-local-nav .box-summary .box a{
 position: absolute;
 top: 0;
 left: 50%;
 transform: translate(-50%,0);
 text-align: center;
}

.products-local-nav .box-summary .box .item{
 transition:all 0.5s;
 position: relative;
}

.products-local-nav .box-summary .box .item img{
 filter: grayscale(100%);
}

.products-local-nav .box-summary .box a:hover .item  img{
 filter: grayscale(0%);
 transition:all 0.5s;
}

._{}

.products-local-nav h1 {
 margin-bottom: 20px;
 margin-left: 20px;
}

.products-local-nav h1 img {
 height: 13px;
 vertical-align: top;
 display: block;
}

.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX{}
._____P02-X_more-btn____{}
.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX{}

.more-btn {
 margin-top: 20px;
}

.more-btn ul {
 overflow: hidden;
 clear: both;
}

.more-btn ul li a {
 font-size: 13px;
 padding-top: 3px;
 padding-bottom: 3px;
 display: block;
 float: left;
}

.more-btn ul li:nth-of-type(1) a {
 width: 160px;
 font-weight: 300;
 color: #FFFFFF;
 background-image: url(../../image/common/common-marker_wt.png);
 background-repeat: no-repeat;
 background-size: auto 11px;
 background-position: left 10px center;
 background-color: #949494;
 text-align: center;
 /*
 padding-left: 34px;
 */
}

.more-btn ul li:nth-of-type(2) a {
 width: 160px;
 font-weight: 400;
 color: #000000;
 background-image: url(../../image/common/extern-link_bk.png);
 background-repeat: no-repeat;
 background-size: auto 10px;
 background-position: right 10px center;
 background-color: #eaeaea;
 text-align: center;
 /*
 padding-left: 24px; 
 */
}

.more-btn ul li:nth-of-type(3) a {
 width: 330px;
 font-weight: 400;
 color: #000000;
 background-image: url(../../image/common/extern-link_bk.png);
 background-repeat: no-repeat;
 background-size: auto 10px;
 background-position: right 10px center;
 clear: both;
 margin-top: 10px;
 background-color: #ffffff;
 text-align: center;
 box-shadow: 0px 0px 0px 1px #cfcfcf inset;
}

._{}

p.more-btn {
 text-align: center;
 margin-top: 45px;
}

p.more-btn a{
 font-size: 13px;
 padding-top: 5px;
 padding-bottom: 5px;
 padding-left: 40px;
 padding-right: 45px;
 display: inline-block;
 text-align: center;
 background-color: #949494;
 font-weight: 300;
 color: #FFFFFF;
 background-image: url(../../image/common/common-marker_wt.png);
 background-repeat: no-repeat;
 background-size: auto 11px;
 background-position: right 10px center;
}

._{}

/*製品情報TOP*/

.PRODUCTS.TOP .more-btn {
 margin-top: 10px;
}

.PRODUCTS.TOP .more-btn ul li a{
 display: block;
}

.PRODUCTS.TOP .more-btn ul li:nth-of-type(1) a {
 width: 30%;
 background-color: #949494; 
}

.PRODUCTS.TOP .more-btn ul li:nth-of-type(2) a {
 width: 68%;
 float: right;
 background-color: #FFFFFF;
/* box-shadow */
box-shadow: 0px 0px 0px 1px #cfcfcf inset;
}

._{}

#lineup .more-btn  {
 text-align: center;
 clear: both;
 margin-bottom: 40px;
 margin-top: -40px;
}

#lineup .more-btn ul {
 display: inline-block;
 overflow: hidden;

}

#lineup .more-btn ul li a{
 font-size: 14px;
 width: 350px;
 padding-top: 12px;
 padding-bottom: 12px;
 display: block;
}


#lineup .more-btn ul li:nth-of-type(1) a{
 font-weight: 400;
 color: #000000;
 background-image: url(../../image/common/extern-link_bk.png);
 background-repeat: no-repeat;
 background-size: auto 10px;
 background-position: right 10px center;
 background-color: #eaeaea;
 margin-bottom: 10px;
}

#lineup .more-btn ul li:nth-of-type(2) a{
 font-weight: 400;
 color: #000000;
 background-image: url(../../image/common/extern-link_bk.png);
 background-repeat: no-repeat;
 background-size: auto 10px;
 background-position: right 10px center;
 clear: both;
 background-color: #FFFFFF;
 box-shadow: 0px 0px 0px 1px #cfcfcf inset; 
}

#lineup .banner{
 margin-bottom: 120px;
}

._{}

#ps-header .more-btn ul li:nth-of-type(1){
 display: none;
}

#ps-header .more-btn ul li:nth-of-type(2) a{
 width: 100%!important;
}

.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX{}
._____P02-X_TERRA____{}
.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX{}
.TERRA{}

.TERRA #choose-a-terrace {
 background-color: #f3f3f3;
}

.TERRA #choose-a-terrace .inner{
 padding-right: 20px;
 padding-left: 20px;
}

.TERRA #choose-a-terrace .top-col {
 
}

.TERRA #choose-a-terrace .top-col ul {
 margin-top: 20px;
}

.TERRA #choose-a-terrace .top-col ul li {
 margin-bottom: 10px;
}

.TERRA #choose-a-terrace .top-col ul li img {
 width: 100%;
}

.TERRA #choose-a-terrace .top-col .txt {
 font-family: 'メイリオ', 'Meiryo', sans-serif;
 font-size: 11px;
 line-height: 18px;
 margin-top: 15px;
 clear: both;
}

.TERRA #choose-a-terrace .bottom-col {
 margin-top: 20px;
}
 
.TERRA #choose-a-terrace .bottom-col .box {
 width: 40%;
}

.TERRA #choose-a-terrace .bottom-col .box .item {

}

.TERRA #choose-a-terrace .bottom-col .box img {
 width: 100%;
}

.TERRA #choose-a-terrace .bottom-col .box dl {}

.TERRA #choose-a-terrace .bottom-col .box dl dt {
 margin-top: 12px;
 padding-bottom: 3px;
 margin-bottom: 10px;
 border-bottom: 1px solid #000000;
}

.TERRA #choose-a-terrace .bottom-col .box dl dd:nth-of-type(1) {
 font-size: 14px;
 line-height: 20px;
 font-weight: 600;
 margin-bottom: 10px;
}

.TERRA #choose-a-terrace .bottom-col .box dl dd:nth-of-type(2) {
 font-family:'メイリオ', 'Meiryo', sans-serif; 
 font-size: 11px;
 line-height: 18px;
}

.TERRA #choose-a-terrace .flow {
 padding-top: 40px;
 clear: both;
}

.TERRA #choose-a-terrace .flow.x-scroll {}

.TERRA #choose-a-terrace .flow.x-scroll img {
}

._{}

.TERRA #lineup {}

.TERRA #lineup table {
 width: 100%;
 margin-bottom: 30px;
 margin-top: 30px;
}

.TERRA #lineup table tr {}

.TERRA #lineup table th,
.TERRA #lineup table td{
 padding-top: 3px;
 padding-right: 5px;
 padding-left: 5px;
 padding-bottom: 3px;
 border-bottom: 1px dashed #dddddd;
 font-size: 11px;
 font-family: 'メイリオ', 'Meiryo', sans-serif;
}

.TERRA #lineup table th{
 width: 200px;
}

.TERRA #lineup th {
 text-align: left;
 font-weight: 400;
 width: 20%;
 vertical-align: middle;
}

.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX{}
._____ff-list____{}
.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX{}

#ff-list {
 clear: both;
}

#ff-list .inner{
 padding-right: 20px;
 padding-left: 20px;
}

#ff-list .main-ttl img{
 width: 100%;
 object-fit: contain;
}

#ff-list .main-ttl span:nth-of-type(2) {
 margin-top: 5px!important;
}

#ff-list .box {
 width: 49%;
 margin-bottom: 30px;
 float: left;
}

#ff-list .box:nth-of-type(odd) {
 float: left;
}

#ff-list .box:nth-of-type(even) {
 float: right;
}

#ff-list .box .item {}

#ff-list .box .item img {
 width: 100%;
}

#ff-list .box dl {}

#ff-list .box dl dt {
 margin-top: 10px;
 margin-bottom: 10px;
 border-bottom: 1px solid #000000;
 padding-bottom: 0px!important;
}

#ff-list .box dl dt img {
 width: 100%;
}

#ff-list .box dl dd:nth-of-type(1) {
 font-size: 15px;
 line-height: 20px;
 font-weight: 600;
 margin-bottom: 15px;
}

#ff-list .box dl dd:nth-of-type(2) {
 font-family:'メイリオ', 'Meiryo', sans-serif; 
 font-size: 11px;
 line-height: 18px;
}

.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX{}
._____option-list____{}
.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX{}

#option-list {
 background-color: #f3f3f3;
 overflow: hidden;
 padding-bottom: 0px;
}

#option-list .inner{
 padding-right: 20px;
 padding-left: 20px;
}

#option-list .main-ttl span:nth-of-type(2){
 color: #000000;
}

#option-list .box {
 width: 49%;
 float: left;
 margin-bottom: 50px;
}

#option-list .box:nth-of-type(1),
#option-list .box:nth-of-type(3){
 margin-right: 2%;
}

#option-list .box .item img {
 width: 100%;
}

#option-list .box:nth-of-type(2) img{
 width: 112%;
}


#option-list .box dl {
 color: #000000;
}

#option-list .box dl dt {
 font-size: 16px;
 line-height: 22px;
 font-weight: 500;
 margin-top: 10px;
 margin-bottom: 10px;
}

#option-list .box dl dd {
 font-family:'メイリオ', 'Meiryo', sans-serif;
 font-size: 11px;
 line-height: 16px;
}

/*GM、GMT、MNT雨どい非表示設定*/
.P02-01 #option-list .box:nth-of-type(4),
.P02-03 #option-list .box:nth-of-type(4),
.P02-06 #option-list .box:nth-of-type(4){
 display: none;
}

.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX{}
._____door-Type____{}
.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX{}

#ff-list .door-Type{
 background-color: #f3f3f3;
 padding-top: 20px;
 padding-right: 20px;
 clear: both;
}

#ff-list .door-Type ul {
 padding-top: 20px;
 padding-right: 20px;
 padding-bottom: 10px;
 padding-left: 20px; 
}

#ff-list .door-Type ul li{
 margin-bottom: 15px;
}

#ff-list .door-Type ul li:nth-of-type(1){
 width: 75%;
}

#ff-list .door-Type ul li:nth-of-type(2){
 width: 95%;
}

#ff-list .door-Type ul li:nth-of-type(3){
 width: 75%;
}

#ff-list .door-Type ul li img{
 width: 100%;
}

.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX{}
._____ff-list-dbox____{}
.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX{}

#ff-list-dbox {
 
}

#ff-list-dbox .inner{
 padding-right: 20px;
 padding-left: 20px;
}

#ff-list-dbox .main-ttl img{
 width: 100%;

}

#ff-list-dbox .box {
 width: 49%;
 margin-bottom: 40px;
}

#ff-list-dbox .box:nth-of-type(odd) {
 float: left;
}

#ff-list-dbox .box:nth-of-type(even) {
 float: right;
}

#ff-list-dbox .box .item {}

#ff-list-dbox .box .item img {
 width: 100%;
}

#ff-list-dbox .box dl {}

#ff-list-dbox .box dl dt img{
 width: 100%;
 margin-top: 10px;
}


#ff-list-dbox .box dl dd:nth-of-type(1) {
 margin-top: 15px;
 padding-bottom: 10px;
 margin-bottom: 12px;
 border-bottom: 1px solid #000000;
 font-size: 14px;
 line-height: 18px;
 font-weight: 600;
}

#ff-list-dbox .box dl dd:nth-of-type(2) {
 font-family:'メイリオ', 'Meiryo', sans-serif; 
 font-size: 12px;
 line-height: 20px;
}

.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX{}
._____lineup____{}
.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX{}

#lineup {
padding-bottom: 0px!important;
}

#lineup > .inner{
 padding-right: 20px;
 padding-left: 20px;
}

#lineup .main-ttl{
 margin-bottom: 20px;
}

#lineup .txt-ttl{
 border-bottom: 3px solid #CFCFCF;
}

#lineup .main-ttl + .txt{
 font-size: 15px;
 line-height: 24px;
 font-weight: 600;
 margin-bottom: 40px;
}

#lineup .box{
 margin-bottom: 60px;
}

#lineup .box > ul > li{
 width: 95%;
 margin-right: auto;
 margin-left: auto;
 margin-bottom: 40px;
}

#lineup .box > ul > li img{
 width: 100%
}

._{}

#lineup .box table + ul {}

#lineup .box table + ul li {
 font-family: 'メイリオ', 'Meiryo', sans-serif;
 font-size: 11px;
 line-height: 18px;
 font-weight: 400;
 position: relative;
 padding-left: 20px;
}

#lineup .box table + ul li::before {
 content: "※";
 display: block;
 width: 10px;
 height: 10px;
 position: absolute;
 top: 0;
 left: 0;
}

._{}

#lineup .one-item {
 margin-bottom: 60px;
 overflow: hidden;
}

#lineup .one-item .top-col {}

#lineup .one-item .top-col .item {}

#lineup .one-item .top-col .item img {
 width: 100%;
}

#lineup .one-item .bottom-col {
 margin-top: 20px;
}

#lineup .one-item .bottom-col .ttl-box {}
#lineup .one-item .bottom-col .ttl-box .item {}

#lineup .one-item .bottom-col .ttl-box .item img {
 width: 100%;
}

#lineup .one-item .bottom-col .ttl-box .txt {
 font-size: 12px;
 line-height: 20px;
}

#lineup .one-item .bottom-col .ttl-box .more {
 margin-top: 10px;
}

#lineup .one-item .bottom-col .ttl-box .more a {}

#lineup .one-item .bottom-col .ttl-box .more a img {
 height: 50px;
}

.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX{}
._____common-box____{}
.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX{}

.common-box {}

.common-box .inner {
 padding-right: 20px;
 padding-left: 20px; 
}

.common-box .box {
 width: 48%;
}

.common-box .box:nth-of-type(1) {
 float: left;
}

.common-box .box:nth-of-type(2) {
 float: right;
}

.common-box .box .sub-ttl {}

.common-box .box .top-col {

}

.common-box .box .top-col .item {
 margin-bottom: 10px;
}

.common-box .box .top-col .item img{
 width: 100%;
}

.common-box .box .bottom-col {

}

.common-box .box .bottom-col .common-dl-txt {}

.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX{}
._____common-dl-txt____{}
.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX{}

.common-dl-txt {

}

.common-dl-txt dl dt {
 font-size: 15px;
 line-height: 24px;
 font-weight: 500;
 margin-bottom: 15px;
}

.common-dl-txt dl dd {
 font-size: 12px;
 line-height: 20px;
 font-weight: 400;
 margin-bottom: 10px;
}

.common-dl-txt dl dd b {
 font-size: 11px;
 line-height: 13px;
 border: 1px solid #FFFFFF;
 padding-top: 5px;
 padding-right: 10px;
 padding-bottom: 5px;
 padding-left: 10px;
 margin-bottom: 10px;
 display: inline-block;
}

.common-dl-txt dl dd br{
 display: none;
}


.common-dl-txt dl dd small {
 font-family:'メイリオ', 'Meiryo', sans-serif; 
 font-size: 11px;
 line-height: 18px;
}

._{}

#lineup-info{
 margin-bottom: 30px;
 }
 
#lineup-info .inner{
/* box-shadow */
box-shadow: 0px 0px 0px 1px #c3c3c3 inset;
 background-color: #FFFFFF;
 padding-left: 10px;
 padding-right: 10px;
 padding-top: 10px;
 padding-bottom: 10px;
 }
 
#lineup-info p{
 font-size: 12px;
 line-height: 16px;
 font-weight: 400;
 background-image: url(../../image/icon/icon_m_06.png);
 background-repeat: no-repeat;
 background-size: 18px auto;
 padding-left: 25px;
 background-position: left top;
} 
 
#lineup-info p br{
 display: none;
} 

._{}

 #lineup .main-ttl b.Excl{
 font-size: 10px;
 line-height: 24px;
 font-weight: 400;
 vertical-align: bottom;
  margin-left: -5px;
 }

