@charset "UTF-8";
/*********************************************************************************


commodity (for sp)


*********************************************************************************/
/*////////////////////////////////////////////////////////////

common

////////////////////////////////////////////////////////////*/
/*========================================
 PC/SP switch
========================================*/
.forPC {
    display: none;
}
.forSP {
    display: inherit;
}

/*========================================
 contents
========================================*/
/* layout
------------------------------*/
.page-commodity section {
    margin-bottom: 40px;
}
.page-commodity .commodity-wrap {
    width: 100%;
    margin: 0 auto;
    padding: 0 10px;
    box-sizing: border-box;
}
.page-commodity .commodity-wrap .wrap-inner {
    padding-left: 0;
}

/* headline
------------------------------*/
.page-commodity h3 {
    font-size: 1.2em;
    line-height: 1.2em;
    padding-left: 1rem;
    margin-bottom: 20px;
}
.page-commodity h3 .sub-title {
    padding-left: 1rem;
}
.page-commodity h3 .sub-title {
    font-size: 1.5rem;
    font-weight: bold;
    color: #abc14c;
    padding-left: 2rem;
}

/* text
------------------------------*/
.page-commodity .commodity-wrap p,
.page-commodity .commodity-wrap ul,
.page-commodity .commodity-wrap ol,
.page-commodity .commodity-wrap dl {
    font-size: 1em;
    line-height: 1.8em;
}

/* image
------------------------------*/
.page-commodity figure {
    margin: 0 0 40px 0;
}
.page-commodity figure figcaption {
    font-size: 2rem;
    margin-bottom: 20px;
}

/* list
------------------------------*/
/* Horizontal */
.page-commodity .list-h li {
    display: block;
}

/* dl
------------------------------*/
.page-commodity dl {
    margin-bottom: 40px;
}

/* button
------------------------------*/
.page-commodity .btn a {
    font-size: 2rem;
}
.page-commodity .btn a span {
    display: inline-block;
    vertical-align: middle;
    width: 34px;
    height: 48px;
    margin-left: 40px;
    background-image: url(../img/pc/company/commodity/ico-btn-arrow-green.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 50% 50%;
}

/*========================================
 header
========================================*/
.page-commodity .commodity-header {
    margin-bottom: 20px;
}
.page-commodity .commodity-header .commodity-wrap {
    padding: 0;
}
.page-commodity .commodity-header h2 {
    padding: 0;
    font-size: 1.2em;
    text-indent: 10px;
    border-bottom: solid 5px #c7d53e;
}
.page-commodity .approval {
    margin-bottom: 20px;
}

/*========================================
contact
========================================*/
.page-commodity .commodity-toList {
    margin-bottom: 60px;
}

/*========================================
contact
========================================*/
.page-commodity .commodity-contact h3 {
    font-size: 2rem;
}

/* address
------------------------------*/
.page-commodity .commodity-contact dl dt {
    font-size: 1em;
}
.page-commodity .commodity-contact dl dd {
    font-size: 1em;
}

/* button
------------------------------*/
.page-commodity .commodity-contact .btn-contact {
    width: 100%;
}
.page-commodity .commodity-contact .btn-contact a {
    display: block;
    width: 100%;
    font-size: 2rem;
    font-weight: bold;
    line-height: 3rem;
    text-align: center;
    padding: 80px 0 0 0;
    background-image: url(../img/pc/company/commodity/ico-btn-arrow-white.png), url(../img/pc/company/commodity/ico-btn-bag.png);
    background-repeat: no-repeat, no-repeat;
    background-position: right center, top center;
    background-size: 20px, 65px;
}


/*////////////////////////////////////////////////////////////

commodity/cyber.html

////////////////////////////////////////////////////////////*/
.page-commodity-cyber figure.img-01 img {
    width: 70%;
}
.page-commodity-cyber figure.img-02 {
    margin-bottom: 40px;
}

/*////////////////////////////////////////////////////////////

commodity/earthquake.html

////////////////////////////////////////////////////////////*/
.page-commodity-earthquake .flex-wrap {
    display: block;
}
.page-commodity-earthquake .flex-wrap .item-info,
.page-commodity-earthquake .flex-wrap .item-image {
    width: 100%;
}
.page-commodity-earthquake .flex-wrap .item-info {
    margin-bottom: 20px;
}
.page-commodity-earthquake .img-01 {
    width: 50%;
}
.page-commodity-earthquake .img-02 {
    width:100%;
}
.page-commodity-earthquake .img-02 img {
    width: 80%;
}

/*////////////////////////////////////////////////////////////

commodity/eo.html

////////////////////////////////////////////////////////////*/

/*////////////////////////////////////////////////////////////

commodity/gnp.html

////////////////////////////////////////////////////////////*/
.page-commodity-gnp dl.dl-01 {
    width: 100%;
}

/*////////////////////////////////////////////////////////////

commodity/rep-warranty.html

////////////////////////////////////////////////////////////*/
/*========================================
merit
========================================*/
.page-commodity-rep-warranty #merit dl {
    border-top: solid 1px #ccc;
}
.page-commodity-rep-warranty #merit dl > * {
    width: 100%;
    border: solid 1px #ccc;
    border-top: none;
    box-sizing: border-box;
}
.page-commodity-rep-warranty #merit dt {
    padding: 15px 15px 15px 3.5rem;
}
.page-commodity-rep-warranty #merit dd {
}

/*========================================
example
========================================*/
/* etc */
.page-commodity-rep-warranty #example .list-etc li:last-child {
    padding-right: 3rem;
}
.page-commodity-rep-warranty #example .list-etc li:last-child:after {
    right: 0;
}
.page-commodity-rep-warranty #example .flex-wrap {
    display: block;
}
.page-commodity-rep-warranty #example .flex-wrap > * {
    width: 100%;
}
/*========================================
0329追記分
========================================*/
.page-commodity .commodity-wrap .wrap-example {
    display: block;
}
.page-commodity .commodity-wrap .wrap-example .bg-color:first-child {
    border-right: none;
}
.page-commodity .commodity-wrap .wrap-example .space01:after {
    right: 0;
}
/*////////////////////////////////////////////////////////////
202207追記
commodity/property.html
////////////////////////////////////////////////////////////*/
.page-commodity .commodity-wrap .note-indent35 {
    padding-left:0em;
    text-indent:0em;
}
/*////////////////////////////////////////////////////////////

commodity/overseas-investment.html

////////////////////////////////////////////////////////////*/
.page-commodity h4.greenBox {
    padding: 8px 10px;
    font-size: 16px;
}
.page-commodity-overseas .figure-wrap {
    margin-left: 0px;
}
.page-commodity-overseas .img-01 {
    margin-bottom: 20px;
}
.page-commodity-overseas dl.point {
    padding: 15px 20px 20px 20px;
    gap: 10px;
    font-size: 14px;
}
.page-commodity-overseas dl.point dt {
    display: block;
    padding: 10px 20px;
    width: 60px;
    margin-top: 10px;
}
.page-commodity-overseas dl.point dt img {
    max-width: 60px;
}
.page-commodity-overseas dl.point dd {
    display: block;
    width: 100%;
    padding: 0px;
}
.page-commodity-overseas .stepBox h4 span.stepimg img{
    padding: 15px 15px;
    width: 60px;
}
.page-commodity-overseas .stepBox h4 span.steptit{
    padding-left: 10px;
}
.page-commodity-overseas .stepBox div{
    padding: 20px 0px 70px 0px;
    background: url(../img/pc/company/commodity/img-step-arrow.png) no-repeat 50% bottom;
    background-size: 60px 50px;
    margin-bottom: 20px;
    font-size: 16px;
}
.page-commodity-overseas .stepBox.stepend div{
    padding: 20px 0px 0px 0px;
    background: none;
}
.page-commodity-overseas .stepBox ol li h5{
    font-size: 16px;
}
.page-commodity-overseas .stepBox ol li p{
    font-size: 16px;
}