@charset "UTF-8";
:root{--MainWidth:1000px;--MainColor: #bda662;--MainPadding: 60px 0 70px 0;--MainColorImp:#8b6ca5;}
#Recom .Inner#ItemImp{--mainColor: #836ca3;--EntryBeforeBorderHover:2px solid var(--mainColor);}

/*---------------------------------------BrandInfo*/
.BrandInfo{
    width: var(--MainWidth);
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 60px;
}
.BrandInfo .Title{
    width: 300px;
    background-color:  var(--MainColor);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 30px;
    box-sizing: border-box;
    color: #fff;
}

.BrandInfo .Title dt{
}
.BrandInfo .Title dt .icon{
    padding-bottom: 15px;
    font-size: 12px;
    font-weight: normal;
}
.BrandInfo .Title dt .icon strong{font-weight: normal;background: rgb(163,152,53);background: -moz-linear-gradient(left, rgba(163,152,53,1) 0%, rgba(186,177,61,1) 50%, rgba(163,152,53,1) 100%);background: -webkit-linear-gradient(left, rgba(163,152,53,1) 0%,rgba(186,177,61,1) 50%,rgba(163,152,53,1) 100%);background: linear-gradient(to right, rgba(163,152,53,1) 0%,rgba(186,177,61,1) 50%,rgba(163,152,53,1) 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a39835', endColorstr='#a39835',GradientType=1 );color: #fff;border: none;padding: 2px 6px;margin-right: 5px;border: 1px solid #fff;}
.BrandInfo .Title dt h3{    font-size: 24px;
    text-align: center;
    line-height: 1.3;
    padding-bottom: 20px;}
body.Imp .BrandInfo .Title dt h3{
	line-height: 1.4;
}
body.Imp .BrandInfo .Title dt h3 span{
	display: block;
}
.BrandInfo .Title dd:before{ content:"";width: 80px;height: 2px;background-color: #fff;display: block;margin: 0 auto;margin-bottom: 20px;}
.BrandInfo .Title dd{
    font-size: 15px;
    line-height: 1.9;
}
body.Imp .BrandInfo .Title dd{
	font-size: 22px;
}
.BrandInfo .Inner{
    flex: 1;
    padding-left: 30px;
}
.BrandInfo .Inner dl{
    border-bottom: 1px solid #ccc;
    padding-bottom: 15px;
    margin-bottom: 15px;
}
.BrandInfo .Inner dt{
    font-size: 19px;
    padding-bottom: 5px;
    display: flex;
    white-space: nowrap;
    align-items: center;
}
.BrandInfo .Inner dt:after{/* content:""; */border-bottom: 1px solid #ccc;width: 100%;height: 1px;margin-left: 5px;}
.BrandInfo .Inner dd{
    font-size: 13px;
    line-height: 1.8;
}
.BrandInfo .Inner dl + dl{
}

.BrandInfo .btn{
    width: 100%;
    text-align: right;
}
.BrandInfo .btn a{font-weight: bold;font-size: 17px;padding: 0;text-align: right;}
.BrandInfo .btn a:before{content:"\f2d2"; font-family:FontAwesome;font-weight: normal;font-size: 14px;display: inline-block;padding-right: 5px;}
.BrandInfo .btn a:after{
    position: relative;
    display: inline-block;
    right: auto;
    top: auto;
    padding-left: 6px;
}
.BrandInfo .btn a:hover{color: #bfb9a9;}


/*------------------------------Recom*/
#Recom{
    width: var(--MainWidth);
    margin: 0 auto;
    margin-bottom: 70px;
}
#Recom .Inner{
}
#Recom .Inner + .Inner{
    margin-top: 50px;
}
#Recom .Inner + .Inner:before{content: "◆◇◆";display: block;width: 100%;font-size: 13px;letter-spacing: 3px;text-align: center;margin-bottom: 40px;color: #ccc;}

#Recom .Inner h2{}

body.Imp #Recom .Inner#ItemImp h2{
	color: var(--MainColorImp);
	margin-bottom: 20px;
}
body.Imp #Recom .Inner h2 .main{
	font-size: 27px;
	margin-bottom: 10px;
	line-height: 1.4;
}
body.Imp #Recom .Inner h2 .sub{
	font-weight: normal;
}
body.Imp #Recom .Inner#ItemImp .InfoTxt{}

/*----------------------------SC*/
#Recom .SC{
    display: flex;
    justify-content: center;
    align-items: center;
    width: var(--MainWidth);
    margin: 0 auto;
    background-color: #efefef;
    padding: 15px 0;
    margin-bottom: 30px;
}
#Recom .SC li{position: relative;text-align: right;}
#Recom .SC li + li{
    margin-left: 40px;
    text-align: left;
}
#Recom .SC li + li:before{
    content:
    "";
    transform: rotate(-60deg);
    width: 1.4em;
    border-top: 1px solid #747474;
    margin: 0;
    padding: 0;
    transform-origin: 50% 0%;
    display: block;
    position: absolute;
    top: 50%;
    left: -30px;
    }
#Recom .SC li a{
    text-decoration: none;
    color: #333;
    font-size: 15px;
}
#Recom .SC li.active a{font-size: 21px;color: var(--MainColor);}
#Recom #ItemImp .SC li.active a{color: var(--MainColorImp);}
#Recom .SC li a:before{content:"\f107";font-family:FontAwesome;display: inline-block;background-color: #4d4d4d;color: #fff;width: 1em;text-align: center;line-height: 1;padding: 2px;border-radius: 2px;margin-right: 5px;}
#Recom .SC li.active a:before{content: none;}
#Recom #ItemImp .SC li.active a:before{
    background-color: var(--MainColorImp);
}
#Recom #ItemImp .SC li a[href="#ItemBis"]:before{content: "\f106";}
#Recom .SC li a:hover:after{
    content:"";
    width: 100%;
    position: absolute;
    height: 1px;
    background-color: #b3b3b3;
    bottom: -2px;
    left: 0;
}

#Recom .SC li.active a:hover:after{content:none;}

/*--------------------------bisInfo*/
#Recom .bisInfo{
    margin-top: 50px;
}
#Recom .bisInfo ul{display:flex;height:100%;flex-wrap:wrap;}
#Recom .bisInfo li{width:50%;background-position:center;background-repeat:no-repeat;background-size:cover;display:flex;align-items:center;position:relative}
#Recom .bisInfo li p{padding:25px;line-height:2;position:relative;z-index:2;color:#fff}
#Recom .bisInfo li:before{position:absolute;width:100%;height:100%;top:0;left:0;z-index:1}
#Recom .bisInfo li:nth-child(1){background-image:url(/business/img/MV_photo_S01.jpg)}
#Recom .bisInfo li:nth-child(2){background-image:url(/business/img/MV_photo_S01_bg.jpg)}
#Recom .bisInfo li:nth-child(2):before{content:"";background-color:rgba(44,77,97,0.7)}
#Recom .bisInfo li:nth-child(3){background-image:url(/business/img/MV_photo_S02_bg.jpg)}
#Recom .bisInfo li:nth-child(3):before{content:"";background-color:rgba(139,99,109,0.7)}
#Recom .bisInfo li:nth-child(4){background-image:url(/business/img/MV_photo_S02.jpg)}

#Recom .bisInfo li.link{
    position: relative;
}
#Recom .bisInfo li.link .btn{
    padding: 0;
    position: absolute;
    bottom: 20px;
    right: 16px;
}
#Recom .bisInfo li.link .btn a{
    background-color: rgb(255 255 255 / 90%);
    padding: 10px 25px;
    border-radius: 100px;
    font-weight: bold;
    text-decoration: none;
    box-shadow: 0 0 4px rgb(0 0 0 / 50%);
}
#Recom .bisInfo li.link .btn a:hover{
    background-color: var(--MainColor);
    color: #fff;
}
#Recom .bisInfo li.link .btn a:after{content:"\f105";font-family:FontAwesome;display: inline-block;padding-left: 10px;}

/*-------------------------------more*/
#Recom .more{width: 100%;text-align:center;margin-top: 30px;}
#Recom .more .ttl{}
#Recom .more .ttl{position:relative;background:#fff;display:inline-block;font-size:14px;font-weight:700;padding: 8px 70px;margin-bottom:20px;border-radius: 3px;}
#Recom .more .ttl:after,
#Recom .more .ttl:before{top:100%;left:50%;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none}
#Recom .more .ttl:after{border-color:rgba(255,255,255,0);border-top-color:#fff;border-width:10px;margin-left:-10px}
#Recom .more .ttl:before{border-color:rgba(38,84,159,0);border-width:11px;margin-left:-11px}
#Recom .more .btn a{border-radius:50px;font-size:16px;font-weight:700;border:2px solid;text-decoration: none;position: relative;display: inline-block;padding: 17px 100px;}
#Recom .more .btn a:after{position: absolute;right: 8px; top:50%; margin-top:-0.5em;content:"\f105"; font-family:FontAwesome; line-height: 1}
#ItemEco .more .ttl{border: 1px solid #0e3750;color: #0e3750;}
#ItemEco .more .ttl:before{border-top-color: #0e3750;}
#ItemBis .more .ttl{border: 1px solid var(--MainColor);color: var(--MainColor);}
#ItemBis .more .ttl:before{border-top-color: #9c8d42;}
#ItemImp .more .ttl{border: 1px solid var(--MainColorImp);color: var(--MainColorImp);}
#ItemImp .more .ttl:before{border-top-color: #6d3c94;}

#ItemEco .more .btn a{background-color: #0e3750;color:#fff;border-color: #0e3750;}
#ItemBis .more .btn a{background-color: var(--MainColor);color: #ffffff;border-color: var(--MainColor);}
#ItemImp .more .btn a{background-color: var(--MainColorImp);color:#fff;border-color: var(--MainColorImp);}

#ItemEco .more .btn a:hover{background-color: #fff;color: #0e3750;}
#ItemBis .more .btn a:hover{color: var(--MainColor);background-color: #fff;}
#ItemImp .more .btn a:hover{color: var(--MainColorImp);background-color: #fff;}

/*-----------------------None*/
#Recom .ItemInner .None{}
#Recom #ItemImp .ItemInner .None a{
    background-color: var(--MainColorImp);
}
#Recom #ItemImp .ItemInner .None a:hover{
    background-color: #54416e;
}