@charset "utf-8";
/* メリーナトップ*/


/*---------------
 タイトル部分
-----------------*/
.titleWrap{
 position: relative;
 height: 480px;
 background: url("/product/mellina/images/top/bg_title.jpg") no-repeat center;
 background-size: cover;
 margin-bottom: 110px;
}
.titleWrap h1{
 padding-top: 78px;
 text-align: center;
 font-size: 1.6rem;
 letter-spacing: 0.1em;
 font-weight: 400;
 background: url("/product/mellina/images/top/logo_mellina.png") no-repeat center top;
 position: absolute;
 left: 9.8%;
 top: 47.2%;
}




/*---------------
 キャッチ部分
-----------------*/
.catchArea{
 text-align: center;
 margin-bottom: 120px;
}
.catchArea h2{
 font-size: 2.6rem;
 letter-spacing: 0.1em;
 margin-bottom: 40px;
}
.catchArea p{
 font-size: 1.4rem;
 line-height: 2.7rem;
}




/*---------------
 カテゴリ共通
-----------------*/
.section-Category .headImage{
 height: 370px;
 background-repeat: no-repeat;
 background-position: center;
 background-size: cover;
 margin-bottom: 100px;
}
.section-Category .sectionTitle{ margin-bottom: 54px;}
.section-Category > p{
 text-align: center;
 font-size: 1.4rem;
 line-height: 2.7rem;
}
.section-Category ul{
 width: 1080px;
 margin: 60px auto 0;
 display: flex;
 flex-wrap: wrap;
}
.section-Category ul li{
 width: 300px;
 text-align: center;
 margin-bottom: 60px;
}
.section-Category ul li:not(:nth-of-type(3n)){ margin-right: 90px;}
.section-Category ul li a{ display: block;}
.section-Category ul li figure{
 display: block;
 width: 300px;
 height: 300px;
 overflow: hidden;
 margin-bottom: 24px;
}
.section-Category ul li figure img{ transition: transform 0.5s ease-out;}
.section-Category ul li a:hover figure img{ transform: scale(1.06) rotate(0.01deg);}
.section-Category ul li p{ font-size: 1.8rem;}




/*---------------
 家庭用製品
-----------------*/
.section-Houseware{ margin-bottom: 75px;}
.section-Houseware .headImage{ background-image: url("/product/mellina/images/top/bg_houseware.jpg");}




/*---------------
 ホテル用製品
-----------------*/
.section-Comfort{ margin-bottom: 140px;}
.section-Comfort .headImage{ background-image: url("/product/mellina/images/top/bg_comfort.jpg");}

/*---------------
 個人向けオンラインショップ
-----------------*/
.ecshop{
    margin-bottom: 120px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.ecshop div {
    margin: 0 auto;
    text-align: center;
}
.ecshop a{
    display: inline-block;
    transition: color 0.2s, opacity 0.2s;
    width: 880px;}

.ecshop a:hover{
    opacity: 0.7;
}

/*---------------
 製品検索とシミュレーター
-----------------*/
.linkArea{
 width: 1080px;
 margin: 0 auto 135px;
}
.searchLink{
 height: 390px;
 color: #fff;
 text-align: center;
}
.searchLink{
 background: url("/product/mellina/images/top/bg_search.jpg") no-repeat center;
 background-size: cover;
 padding: 66px 560px 0 0;
 margin-bottom: 60px;
}

.linkArea h2{
 display: flex;
 flex-direction: column;
 justify-content: space-between;
 height: 76px;
 font-size: 1.2rem;
 font-weight: 300;
 margin-bottom: 28px;
}
.linkArea h2 .AvenirMedium{
 font-size: 5.2rem;
 line-height: 1;
}
.linkArea div p{
 font-size: 1.4rem;
 line-height: 2.4rem;
}
.linkArea .searchLink .linkBtn{ margin-top: 25px;}
.linkArea .trayLink .linkBtn{
 margin-top: 21px;
 margin-bottom: 15px;
 font-size: 1.3rem;
}
.linkArea div small{ font-size: 1rem;}

/*リンク*/
.section-Category p a,
.lineupList .descriptionArea .textWrap p a{
 color: #003f7e;
 border-bottom: 1px solid #003f7e;
 transition: border-color 0.1s;
}
.section-Category p a:hover,
.lineupList .descriptionArea .textWrap p a:hover{ border-color: rgba(255,255,255,0);
}


