@charset "UTF-8"; 
/*TOPへ戻る*/
.floating {
	position: fixed;
	bottom: 2rem;
	right: 2rem;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
スムーススクロールメニュー
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.cat_menu_lits .item a p.img {
    margin-bottom: 1.5rem;
}

.cat_menu_lits .item a h2.ttl {
    position: relative;
    font-size: 3rem;
}

.cat_menu_lits .item a h2.ttl::after {
    content: "";
    display: inline-block;
    background: url("../images/page/product/product_arrow.svg") no-repeat 0 55% / contain;
    width: 25px;
    height: 1em;
    margin-left: 0.5em;
}

.cat_menu_lits .item a p.cats {
    font-size: 0.9em;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
共通
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.cmn_product h2.prod_ttl {
    font-size: 3.5rem;
    border-bottom: 1px solid #c8c8c8;
    margin: 3em 0 1em 0;
}

.cmn_product h2.prod_ttl span {
    font-size: 2.4rem;
}

.cmn_product .prod_main {
    margin-bottom: 50px;
}

.cmn_product .prod_main .prod_head {
    background-color: #222222;
    color: #ffffff;
}

.cmn_product .prod_main .prod_head p.main_img {
    width: 50%;
    max-width: 570px;
}

.cmn_product .prod_main .prod_head .txt_area {
    width: 50%;
    padding: 2em;
    position: relative;
}

.cmn_product .prod_main .prod_head .txt_area h3.ttl {
    font-size: 4.2rem;
    margin-bottom: 1em;
}

.cmn_product .prod_main .prod_head .txt_area p.txt {
    font-size: 1.6rem;
    margin-bottom: 2em;
}

.cmn_product .prod_main .prod_head .txt_area p.btn.look {
    border-top: 1px solid #ffffff;
    border-right: 1px solid #ffffff;
    border-bottom: 1px solid #ffffff;
    border-left: 1px solid #ffffff;
    padding: 1em;
    display: flex;
    justify-content: center;
    position: absolute;
    bottom: 2em;
    width: 100%;
    color: #FFFFFF;
	cursor: pointer;
	transition: .2s ease-in;
}

.cmn_product .prod_main .prod_head .txt_area p.btn.look:hover{
	opacity: .7;
}

.cmn_product .prod_main .prod_head .txt_area p.btn.look span{
	cursor: pointer;
	position: relative;
}

.cmn_product .prod_main .prod_head .txt_area p.btn.look span::after {
    content: "";
    display: inline-block;
    background: url("../images/page/product/product_look.svg") no-repeat 0 55% / contain;
    width: 15px;
    height: 1em;
    margin-left: 1.5em;
	transition: .3s ease-in;
}

.cmn_product .prod_main .prod_head .txt_area p.btn.look.open span::after {
    transform: rotate(180deg);
    transform-origin: center;
}

.cmn_product .prod_main .prod_lineup {
    margin-top: 5rem;
}

.cmn_product .prod_main .prod_lineup ul.items li {
    display: flex;
    width: 100%;
    margin: 0 0 2rem;
}

.cmn_product .prod_main .prod_lineup ul.items li p.img {
    width: 50%;
    max-width: 571px;
}

.cmn_product .prod_main .prod_lineup ul.items li .txt_area {
    width: 50%;
    padding: 1em 2em;
}

.cmn_product .prod_main .prod_lineup ul.items li .txt_area h3 {
    font-size: 2.6rem;
    margin-bottom: 1rem;
}

.cmn_product .prod_main .prod_lineup ul.items li .txt_area p.txt {
    font-size: 1.6rem;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
カテゴリーメニュー
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.cat_menu_lits.f_wrap {
    width: 100%;
    max-width: 1500px;
    margin: 0 0 6rem 0;
    justify-content: space-between;
}

.cat_menu_lits.f_wrap .item {
    width: 45%;
    margin-bottom: 6rem;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
@media screen and (max-width: 750px) 
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media screen and (max-width: 750px) {
	.floating {
		width: 9.8rem;
		height: 9.8rem;
	}

    img {
        max-width: 100%;
        height: auto;
    }

    .cat_menu_lits.f_wrap {
        flex-direction: column;
        width: inherit;
        max-width: 100%;
    }

    .menu_width {
        width: 100%;
        min-width: 100%;
        padding-top: 10rem;
    }

    .cat_menu_lits.f_wrap .item {
        width: inherit;
    }

    .main_area.page_product {
        width: calc(100% - 15rem);
        margin: 0 auto;
    }

    .cat_menu_lits .item a h2.ttl {
        font-size: 4.2rem;
    }

    .cat_menu_lits.f_wrap {
        flex-direction: column;
    }

    .cmn_product h2.prod_ttl {
        font-size: 4.4rem;
        margin: 3em 0 1em 0;
        border: none;
    }
	
	.cmn_product:first-of-type h2.prod_ttl{
		margin-top: 0;
	}

    .cmn_product h2.prod_ttl span {
        font-size: 2.3rem;
        display: block;
        border-top: 1px solid;
        margin-top: 1rem;
        padding-top: 2rem;
        margin-left: -1rem;
    }


    .cmn_product .prod_main .prod_lineup ul.items li {
        flex-direction: column;
        margin-bottom: 4rem;
    }

    .cmn_product .prod_main .prod_head .f_wrap {
        flex-direction: column;
        position: relative;
    }

    .cmn_product .prod_main .prod_head p.main_img {
        width: inherit;
    }

    .cmn_product .prod_main .prod_head p.main_img.sp_img_container {
        position: relative;
        padding-top: 68.5%;
        overflow: hidden;
    }

    .cmn_product .prod_main .prod_head p.main_img.sp_img_container img {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -70%);
        height: 170%!important;
        width: 150%;
        object-fit: cover;
        font-family: 'object-fit: cover;';
    }

    .cmn_product .prod_main .prod_head .txt_area {
        position: absolute;
        width: 100%;
        background-color: rgba(0,0,0,0.80);
        bottom: 0;
        height: 17.4rem;
        padding: 0;
    }

    .cmn_product .prod_main .prod_head .txt_area p.txt {
        display: none;
    }

    .cmn_product .prod_main .prod_lineup ul.items li p.img {
        width: inherit;
    }

    .cmn_product .prod_main .prod_head .txt_area h3.ttl {
        font-size: 4.2rem;
        padding: 2rem;
        margin-bottom: 0;
		
    }

    .cmn_product .prod_main .prod_head .txt_area p.btn.look {
        border-top: 1px solid #ffffff;
        border-right: none;
        border-bottom: none;
        border-left: none;
        padding: 0.8em;
        display: flex;
        justify-content: center;
        font-size: 2.4rem;
        bottom: 0;
        width: 100%;
        color: #FFFFFF;
    }

    .cmn_product .prod_main .prod_lineup ul.items li .txt_area h3 {
        font-size: 3.6rem;
    }

    .cmn_product .prod_main .prod_lineup ul.items li .txt_area p.txt {
        font-size: 2.4rem;
        line-height: 1.5833333;
    }

    .cmn_product .prod_main .prod_lineup ul.items li .txt_area {
        width: inherit;
        padding: .5em 0em 0px;
     }
	/*OTC ボタン無し*/
	.cmn_product .prod_main.btn_none .prod_head .txt_area{
		height: 4em;
	}
	
	.cmn_product .prod_main.btn_none .prod_head .txt_area h3.ttl{
		padding: 3rem 2rem;
	}
}