﻿/* =============================================================
 module layout
============================================================= */
body{color: #333;}

a{color: #d6b50e;}
a:hover{color: #f2a37c;}

.fCChange{color: #00164b;}
.cmnBtn_1{color: #d6b50e;}
.cmnBtn_1::after{border-left-color: #d6b50e;}
.cmnTtl_2::after{background-color: #d6b50e;}
.flowLst > li::after{border-left-color: #00164b;}
.flowLst .num{background-color: #00164b;}
.flowLst .txtArea .ttl{color: #00164b;}

.cmnBtn_1:hover::after{border-left-color: #ffcab0;}
.cmnBtn_2 > a{background-color: #efe6b9;}
.cmnBtn_2 > a:hover{color: #563114;}

.cmnTbl th,
.cmnTbl td{border-color:#00164b;}

.cmnTbl th{background-color:#00164b;}

.cmnTbl tr:last-child th{border-bottom-color: #00164b!important;}
@media only screen and (max-width:640px){.cmnTbl.row tr:last-child td{border-bottom-color: #00164b;}
.cmnTbl th{border-bottom: 0!important;}}

.fCSubChange{color: #d6b50e;}
.benefits .number::before{background-color: #efe6b9;}

.cmnTtl_1 > span{
    background-color: #00164b;
    color: #fff;
}

.fSize20sp16{font-size:20px !important;}
@media only screen and (max-width:640px){
.fSize20sp16{font-size:16px !important;}
}

/* =============================================================
 style
============================================================= */

.benefits .photodate{
	width: 200px;
	transform: rotate(10deg);
}

.goodsSample{
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
}

@media only screen and (max-width:640px){
    .benefits .photodate{width: 150px;}
}

/* sampleClm
------------------------------------------------------- */
.sampleClm li{
    width:200px;
}

.goodsSample{
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
}

@media only screen and (max-width:640px){
    .sampleClm li{
        width: calc(50% - 4px);
    }
}


/* EOF */