@charset "UTF-8";


/*PAGE HEAD*/
/*-------------------------------------------------------*/

.page_head{
    position: relative;
    width: 100%;
    margin: 100px 0 10px 0;
    background-image:linear-gradient(to bottom, #0096e1, #0768bb);
    overflow: hidden;
    z-index: 2;
}
.page_head::before{
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-image: url("../images/page-head-back.png");
    background-size: cover;
    background-position: right top;
    background-repeat: no-repeat;
}

.page_head .inner{
    height: 400px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-flow: column;
    text-align: center;
    color: #ffffff;
}
.page_head .inner p{
    position: relative;
    z-index: 10;
    
}
.page_head .inner .c_headline{
    width: 400px;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #cccccc;
    font-size: 2rem;
    line-height: 2rem;
    font-weight: 800;
    letter-spacing: 0.2rem;
}
.page_head .inner h1{
    font-size: 1.5rem;
    font-weight: 800;
    position: relative;
    z-index: 10;
}

.head_row{
    width: 341px;
    margin: 0 auto 100px auto;
}
.head_row img{
    width: 100%;
    height: auto;
}

/*PAGE TITL LEAD*/
/*-------------------------------------------------------*/
.t_lead{
    width: 100%;
    max-width: 1300px;
    margin: 0 auto 100px auto;
    padding: 0 20px;
    text-align: center;
}
.t_lead .name, .t_lead .name2, .t_lead .name3{
    margin: 0 auto 30px auto;
}
.t_lead h2{
    font-size: 1.5rem;
    font-weight: 800;
    margin-bottom: 20px;
}
.t_lead h2 span{
    display: block;
}
.t_lead .box{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}
.t_lead .box li{
    width: 48%;
    display: flex;
	align-items: center;
    justify-content: center;
    margin: 0 3% 3% 0;
    padding: 20px 10px;
    font-size: 1.3rem;
    font-weight: 800;
    text-align: left;
    border: 1px solid #cccccc;
}
.t_lead .box li:nth-child(even){
    margin-right: 0;
}

.bg{
    background: url("../images/co_bg.png");
    background-repeat: no-repeat;
    background-size: 210% auto;
    background-position: top+310px right+105%;
}

/*ソリューション*/
/*-------------------------------------------------------*/
.s_container{
    width: 100%;
    margin-bottom: 150px;
}
.s_container .inner{
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
}
.sol_top_titl h2{
    margin: 0 auto 100px auto;
    padding: 0 20px;
    text-align: center;
    font-size: 2rem;
}
.sol_titl{
    max-width: 1300px;
    margin: 0 auto 100px auto;
    padding: 0 20px;
    text-align: center;
}

.sol_titl h2{
    margin-bottom: 20px;
    font-size: 3rem;
    font-weight: 800;
    color: #0768bb;
}
.sol_titl p{
    font-size: 1.2rem;
}

/* ----------ソリューションTOP---------- */
.sol_top{
    width: 100%;
    margin: 0 auto;
    padding: 0 20px;
    max-width: 1300px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.sol_top .sol_top_btn{
    width: 49%;
    margin-bottom: 30px;
    position: relative;
    background: #ffffff;
    border: 1px solid #cccccc;
}
.sol_top .sol_top_btn a{
    display: block;
    padding: 50px 20px;
}
.sol_top .sol_top_btn span{
    width: 7rem;
    padding: 5px 0;
    position: absolute;
    top: 0;
    left: 0;
    background: #33ccff;
    text-align: center;
    font-size: 0.8rem;
    color: #ffffff;
}
.sol_top .sol_top_btn h3{
    margin-bottom: 10px;
    padding-bottom: 10px;
    position: relative;
    font-size: 1.5rem;
    font-weight: 800;
    color: #0768bb;
}
.sol_top_under{
    width: 100%;
    height: 220px;
    margin-bottom: 150px;
}
.sol_top .sol_top_btn h3::after{
    content: "";
    width: 70%;
    height: 5px;
    position: absolute;
    left: -20px;
    bottom: 0;
    background: #0768bb;
}
.sol_top .sol_top_btn::before{
    content: "";
    display: block;
    position: absolute;
    bottom: 20px;
    left: 20px;
    width: 20px;
    height: 5px;
    border: none;
    border-right: 2px solid #0768bb;
    border-bottom: 1px solid #0768bb;
    transform: skew(45deg);
    transition: .3s;
}
.sol_top .sol_top_btn:hover::before{
    width: 40%;
}

/* ------------CONTENTS 1------------ */
.solution1_line{
    background-image: linear-gradient(#0768bb, #0768bb);
    background-size: 65% 15px;
    background-position: bottom left;
    background-repeat: no-repeat;
}
.solution1{
    display: flex;
    flex-wrap: wrap;
    padding: 0px 20px;
    background: url("../solution/images/bg_f.png");
    background-repeat: no-repeat;
    background-position: top right;
    background-size: 700px auto;
}
.solution1 .headline1{
    width: 170px;
    height: 170px;
    margin-bottom: 100px;
}
.solution1 .headline1 div{
    position: relative;
    width: 100%;
    display: block;
    padding-top: 100%;
    color: #ffffff;
    border-radius: 50%;
    background: linear-gradient(to bottom, #0096e1, #0768bb);
}
.solution1 .headline1 div span{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    padding-top: 20%;
    font-size: 2rem;
    font-weight: 800;
    text-align: center;
}
.solution1 .headline2{
    width: 70%;
    padding-left: 30px;
    margin-bottom: 150px;
}
.solution1 .headline2 h2{
    margin-bottom: 10px;
    padding: 50px 0 10px 0;
    font-size: 4rem;
    line-height: 3rem;
    font-weight: 800;
}

.solution1 .box, .solution1 .box_single{
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.solution1 .box div, .solution1 .box_single div{
    padding: 0 50px;
    margin-bottom: 50px;
}
.solution1 .box div{
    width: 48.5%;
}
.solution1 .box_single div{
    width: 97%;
}
.solution1 .box div h3, .solution1 .box_single div h3{
    position: relative;
    margin-bottom: 15px;
    font-size: 1.2rem;
    font-weight: 800;
}
.solution1 .box div h3::before, .solution1 .box_single div h3::before{
    content: "";
    position: absolute;
    left: -50px;
    top: 10px;
    width: 40px;
    height: 5px;
    background: #0768bb;
}

/* ------------CONTENTS 2------------ */
.solution2{
    padding: 0 20px;
}
.solution2_line{
    background-image: linear-gradient(to right, #0096e1, #0769bc), url("../solution/images/bg_solution2.png");
    background-size: 70% 15px, 132px auto;
    background-position: top+135px left, top+135px right+30%;
    background-repeat: no-repeat, no-repeat;
}
.solution2 .headline01, .solution2 .headline02, .solution2 .headline03, .solution2 .headline04, .solution2 .headline05, .solution2 .headline06{
    width: 100%;
    padding: 0 17% 50px 0;
    margin: 0 0 80px 0;
    text-align: right;
}
.solution2 .headline01 h2, .solution2 .headline02 h2, .solution2 .headline03 h2, .solution2 .headline04 h2, .solution2 .headline05 h2, .solution2 .headline06 h2{
    position: relative;
    font-size: 5rem;
    line-height: 5rem;
    font-weight: 800;
    color: #0769bc;
}
.solution2 .headline01 h2::before, .solution2 .headline02 h2::before, .solution2 .headline03 h2::before, .solution2 .headline04 h2::before, .solution2 .headline05 h2::before, .solution2 .headline06 h2::before{
    position: absolute;
    top: -55px;
    right: 0;
    font-size: 1rem;
    color: #333333;
}
.solution2 .headline01 h2::before{
    content: "中央自動車工業の除菌／抗菌・抗ウイルスコーティングが";
}
.solution2 .headline02 h2::before{
    content: "中央自動車工業の防汚コーティングが";
}
.solution2 .headline03 h2::before{
    content: "中央自動車工業の帯電防止コーティングが";
}
.solution2 .headline04 h2::before{
    content: "中央自動車工業の反射防止・透過率改善コーティングが";
}
.solution2 .headline05 h2::before{
    content: "中央自動車工業の密着性・濡れ性改善コーティングが";
}
.solution2 .headline06 h2::before{
    content: "中央自動車工業の劣化防止コーティングが";
}

.solution2 .box {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
}
.solution2 .box div{
    width: 30%;
}
.solution2 .box div .head{
    width: 100%;
    height: 100px;
    margin-bottom: 30px;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}
.solution2 .box div .head .number {
    width: 140px;
    position: relative;
    font-size: 6rem;
    line-height: 6rem;
    font-weight: 800;
    color: #0769bc;
    background: -webkit-linear-gradient(0deg, #0096e1, #0768bb);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.solution2 .box div .head .number::after{
    content: "Reasons to be chosen";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -45px;
    margin: auto;
    text-align: center;
    font-size: 0.5rem;
    color: #cccccc; 
    background: -webkit-linear-gradient(0deg, #0096e1, #0768bb);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.solution2 .box div .head h3{
    font-size: 1.5rem;
    font-weight: 800;
    color: #0769bc;
}

/* ------------CONTENTS 3------------ */
.solution3 {
    padding-top: 100px;
    background: url("../solution/images/bg_solution3.png");
    background-size: 147px auto;
    background-position: top center;
    background-repeat: no-repeat;
}
.solution3 .mark{
    width: 88px;
    margin: 0 auto 20px auto;
}
.solution3 .mark img{
    width: 100%;
    height: auto;
}
.solution3 h2{
    margin-bottom: 20px;
    padding: 0 20px 20px 20px;
    font-size: 2rem;
    font-weight: 800;
    text-align: center;
    color: #ffffff;
}
.solution3 .box{
    padding: 50px 20px;
    text-align: center;
    background: #ffffff;
}
.solution3 .box .head{
    margin: 0 auto 30px auto;
}
.solution3 .box .head div{
    width: 100%;
    margin: 0 auto 30px auto;
    padding: 20px 0;
    background: #ffffff;
}
.solution3 .box .head .pro_rogo{
    border-bottom: 1px dotted #aaaaaa;
}
.solution3 .box .head div img{
    width: 240px;
    height: auto;
}
.solution3 .box .head .sol3_rogo_small img{
    width: 290px;
    height: auto;
}
.solution3 .box .head .sol3_rogo_small2 img{
    width: 170px;
    height: auto;
}
.solution3 .box .head h3{
    font-size: 1.8rem;
    font-weight: 800;
    margin-bottom: 30px;
}
.solution3 .box .head h4{
    width: 54%;
    margin: 0 auto 20px auto;
    padding: 5px 0;
    font-size: 1.3rem;
    font-weight: 800;
    color: #0768bb;
    border: 1px solid #0096e1;
}
.solution3 .box .head .so3_lead{
    font-size: 1.2rem;
    font-weight: 800;
}
.solution3 .box ul{
    margin-bottom: 50px;
    padding: 0 150px;
}
.solution3 .box ul li{
    text-indent: -6rem;
    padding-left: 6rem;
    text-align: left;
}
.solution3 .box .head .subheading{
    font-size: 1.2rem;
    font-weight: 800;
    color: #000000;
}
.solution3 .box .figure_img{
    display: flex;
    justify-content: space-between;
}
.solution3 .box .figure_img div{
    width: 45%;
    padding: 20px;
    display: flex;
    flex-direction: column;
}
.solution3 .box .figure_img div .box_titania{
    width: 100%;
    margin: -10px 0 -20px 0;
    display: flex;
    flex-direction: row;
    flex-grow: 1;
    text-align: center;
}
.solution3 .box .figure_img div .box_titania p{
    width: 100%;
    text-align: center;
}

.solution3 .box .figure_img .arrow{
    width: 7%;
    display: flex;
    flex-direction: row;
    align-items: center;
}
.solution3 .box .figure_img .arrow img{
    width: 100%;
    height: auto;
}
.solution3 .box .figure_img div h4{
    padding: 5px 0;
    margin-bottom: 20px;
    background: #0769bc;
    font-weight: 800;
    color: #ffffff;
}
.solution3 .box .figure_img div .not_bar{
    background: #777777;
}
.solution3 .box .figure_img div .img{
    position: relative;
    width: 80%;
    margin: 0 auto;
    display: block;
    flex-shrink: 0;
}
.solution3 .box .figure_img div .img span{
    position: absolute;
    top: 0;
    left: -50px;
    width: 50%;
    flex-shrink: 0;
}
.solution3 .box .figure_img div .img2{
    width: 100%;
}
.solution3 .box .figure_img div .img img, .solution3 .box .figure_img div .img2 img{
    width: 100%;
    height: auto;
}
.solution3 .box .figure_img div .static_txt{
    width: 78%;
    margin: 0 auto;
    text-align: left;
}

.solution3 .box .data_ale{
    padding-bottom: 50px;
}
.solution3 .box .data_ale div{
    width: 80%;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
}
.solution3 .box .data_ale h4{
    width: 40%;
    padding: 5px 0;
    margin: 50px auto;
    background: #0769bc;
    color: #ffffff;
    font-weight: 800;
}
.solution3 .box .data_ale div dl{
    width: 50%;
    display: flex;
    border-bottom: 1px solid #bbbbbb;
}
.solution3 .box .data_ale div dl:nth-child(1), .solution3 .box .data_ale div dl:nth-child(2){
    border-top: 1px solid #bbbbbb;
}
.solution3 .box .data_ale div dl dd, .solution3 .box .data_ale div dl dt{
    width: 50%;
    text-align: center;
    padding: 20px 0;
}
.solution3 .box .data_ale div dl dd{
    background: #dddddd;
}

/* ------------SOLUTION------------ */
.sol_ect{
    margin-bottom: 120px;
    padding: 0 20px;
    font-size: 1.6rem;
    font-weight: 800;
    text-align: center;
}

/* ------------CONTENTS 4------------ */

.solution4 {
    position: relative;
    padding: 50px 20px;
    text-align: center;
}
.solution4::before {
    content: "";
    position: absolute;
    width: 30%;
    height: 5px;
    right: 0;
    left: 0;
    top: 0;
    margin: auto;
    background: #0769bc; 
}
.solution4 h2{
    font-size: 2rem;
    font-weight: 800;
    margin-bottom: 50px;
}
.solution4 .construction_img{
    width: 940px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}
.solution4 .construction_img li{
    width: 300px;
    margin: 0 20px 20px 0;
}
.solution4 .construction_img li:nth-child(3n){
    margin-right: 0;
}
.solution4 .construction_img li span{
    display: block;
    margin-bottom: 10px;
}
.solution4 .construction_img li img{
    width: 100%;
    height: auto;
}

/* 製品ロゴ */
.solution4 .rogo_list{
    width: 980px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
}
.rogo_list_left{
    justify-content: flex-start;
}
.rogo_list_center{
    justify-content: center;
}
.solution4 .rogo_list li{
    width: 300px;
    margin: 0 20px 20px 0;
    border: 1px solid #cccccc;
    transition: all 0.3s;
}
.solution4 .rogo_list li:nth-child(3n), .solution4 .rogo_list li:nth-child(6n){
    margin-right: 0;
}
.solution4 .rogo_list li a{
    display: block;
    padding: 15px 20px;
}
.solution4 .rogo_list li:hover{
    background: #06AFF1;
    color: #ffffff;
}

/*製品について*/
/*-------------------------------------------------------*/

.p_container{
    width: 100%;
    margin-bottom: 130px;
}
.p_container .inner{
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
}
.p_container .inner h2{
    width: 100%;
    margin: 0 0 100px -70px;
    font-size: 2.8rem;
    font-weight: 800;
    color: #ffffff;
}
.p_container .inner h2 span{
    margin-bottom: 10px;
    padding: 3px 20px;
    background: #0769bc;
    display: inline-block;
}

/* ----------製品TOP---------- */
.pro_top{
    width: 100%;
    margin-bottom: 150px
}
.pro_top .inner{
    width: 100%;
    margin: 0 auto;
    padding: 0 20px;
    max-width: 1300px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    background: #ffffff;
}
.pro_top .inner .pro_top_btn{
    width: 48%;
    margin-bottom: 30px;
    position: relative;
    background: #ffffff;
    border: 1px solid #cccccc;
}
.pro_top .inner .pro_top_btn a{
    display: block;
    padding: 50px 20px;
}
.pro_top .inner .pro_top_btn span{
    width: 7rem;
    padding: 5px 0;
    position: absolute;
    top: 0;
    right: 0;
    background: #777777;
    text-align: center;
    font-size: 0.8rem;
    color: #ffffff;
}
.pro_top .inner .pro_top_btn h3{
    margin-bottom: 10px;
    padding-bottom: 10px;
    position: relative;
    font-size: 1.5rem;
    font-weight: 800;
    color: #0768bb;
}
.pro_top .inner .pro_top_btn h3::after{
    content: "";
    width: 70%;
    height: 5px;
    position: absolute;
    left: -20px;
    bottom: 0;
    background: #0768bb;
}

.pro_top .inner .pro_top_btn::before{
    content: "";
    display: block;
    position: absolute;
    bottom: 20px;
    left: 20px;
    width: 20px;
    height: 5px;
    border: none;
    border-right: 2px solid #0768bb;
    border-bottom: 1px solid #0768bb;
    transform: skew(45deg);
    transition: .3s;
}
.pro_top .inner .pro_top_btn:hover::before{
    width: 40%;
}

@media screen and (min-width: 10px) and (max-width: 1400px) {
.p_container .inner h2{
    margin: 0 0 100px 0px;
}

}


/* CONTENTS 背景 */
.bg_w{
    background: #ffffff;
}
.inner_sh{
    -webkit-box-shadow: 0px 10px 10px -5px #3A3939;
	box-shadow: 0px 10px 10px -5px #3A3939; 
}
.b_co_bl{
    background-image: linear-gradient(#dde9f3, #dde9f3);
    background-size: 100% 700px;
    background-repeat: no-repeat;
}
.b_co_bl2{
    background-image: linear-gradient(#dde9f3, #dde9f3);
    background-position: top+100px left;
    background-size: 100% 700px;
    background-repeat: no-repeat;
}
.b_co_bl3{
    background-image: linear-gradient(#dde9f3, #dde9f3);
    background-position: top+50px left;
    background-size: 100% 600px;
    background-repeat: no-repeat;
}
.b_co_bl4{
    background-image: linear-gradient(to bottom, #0096e1, #0768bb);
    background-position: top left;
    background-size: 100% 35%;
    background-repeat: no-repeat;
}
.b_co_line{
    background-image: linear-gradient(#dddddd, #dddddd);
    background-size: 100% 1px;
    background-position: top+30px left;
    background-repeat: no-repeat;
}
.bg_line{
    border-top: 1px solid #cccccc;
    border-bottom: 1px solid #cccccc;
}

/* ------------CONTENTS 1------------ */

/*CPC ALE , チタニア　アルミ*/

.img_frame, .img_frame_w, .img_frame_alumi{
    margin: 0 auto 30px auto;
    padding: 0 0 20px 0;
    display: block;
    text-align: center;
}
.img_frame_alumi{
    position: relative;
    width: 70%;
    max-width: 540px;
}
.img_frame{
    position: relative;
    width: 70%;
    max-width: 600px;
}
.img_frame::after{
    content: "店舗への施工シーン";
    position: absolute;
    bottom: 40px;
    left: -70px;
    width: 12rem;
    padding: 3px 0;
    background: #ffffff;
}
.img_frame::before{
    content: "住居への施工シーン";
    position: absolute;
    bottom: 40px;
    right: -70px;
    width: 12rem;
    padding: 3px 0;
    background: #ffffff;
}
.img_frame_w img, .img_frame img, .img_frame_alumi img{
    width: 100%;
    max-width: 800px;
    height: auto;
}

.t_box{
    margin-bottom: 50px;
    padding: 0 4rem;
}

/*CPC ALE, チタニア ,エクセルピュア*/
.f_box, .f_box_ex{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 30px 20px 0 20px;
    background: #ffffff;
}
.f_box_ex{
    margin-bottom: 30px;
}
.f_box div{
    width: 49%;
    margin-bottom: 2%;
    padding: 50px 30px 50px 100px;
    background: linear-gradient(to bottom, #0096e1, #0768bb);
    color: #ffffff;
}
.f_box_ex div{
    width: 24%;
    padding: 25px 0;
    background: linear-gradient(to bottom, #0096e1, #0768bb);
    color: #ffffff;
    text-align: center;
}
.f_box_ex div span{
    width: 80%;
    padding-bottom: 5px;
    margin: 0 auto 5px auto;
    display: block;
    font-size: 0.6rem;
    border-bottom: 1px dotted #ffffff;
}
.f_box_ex h3{
    width: 100%;
    margin-bottom: 50px;
    font-size: 2rem;
    color: #0768bb;
    font-weight: 800;
    text-align: center;
}

.f_box div .ale, .f_box div .caw{
    position: relative;
    margin-bottom: 40px;
    font-size: 1.5rem;
}
.f_box div .ale span, .f_box div .caw span{
    position: absolute;
    top: -35px;
    left: -40px;
    display: block;
    font-size: 3.5rem;
}
.f_box div .ale::after, .f_box div .caw::after{
    position: absolute;
    top: -15px;
    left: 0;
    font-size: 0.6rem;
}
.f_box div .ale::after{
    content: "CPC ALE";
}
.f_box div .caw::after{
    content: "Antibacterial and deodorant titania";
}
.f_box div .ale::before, .f_box div .caw::before{
    content: "";
    position: absolute;
    bottom: -20px;
    left: -100px;
    width: 40%;
    height: 5px;
    background: #ffffff;
}


/*エクセルピュア */
.patent{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 50px 0 0 0;
    background: url("../product/images/ex_img01.png");
    background-position: center center;
    background-size: 1400px auto;
    border: 1px solid #cccccc;
    text-align: center;
}
.patent h3::after{
    content: "自動車コーティングのリーディングカンパニー";
    position: absolute;
    top: -25px;
    left: 0;
    right: 0;
    margin: auto;
    font-size: 0.7rem;
}
.patent h3{
    position: relative;
    font-size: 2rem;
    margin-bottom: 50px;
}
.patent div{
    width: 40%;
    display: inline-block;
    background: #0769bc;
    color: #ffffff;
}
.ex_list{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding: 0 30px 30px 30px;
}
.ex_list li{
    width: 43%;
    margin: 0 5% 15px 0;
    display: block;
}
.ex_list li:nth-child(even){
    margin: 0;
}


/* ------------CONTENTS 2------------ */


/*CPC ALE, チタニア*/
.f_box2{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.f_box2 div{
    width: 48%;
    margin-bottom: 50px;
    padding: 30px;
    border: 1px dotted #aaaaaa;
}
.f_box2 div h3{
    position: relative;
    margin-bottom: 20px;
    padding-bottom: 20px;
    font-size: 1.2rem;
    font-weight: 800;
    text-align: center;
    border-bottom: 1px solid #cccccc;
}
.f_box2 div h3::before{
    content: "";
    position: absolute;
    top: -30px;
    left: 0;
    right: 0;
    margin: auto;
    width: 40%;
    height: 5px;
    background: #0769bc;
}

/*チタニア*/
.f_box2 div .siaa_img{
    width: 70%;
    max-width: 500px;
    margin: 30px auto;
    display: block;
}
.f_box2 div .siaa_img img{
    width: 100%;
    height: auto;
}

/*EX*/
.f_box2_ex{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.f_box2_ex .box{
    width: 100%;
    padding: 0 30px;
}
.f_box2_ex .box h3{
    width: 50%;
    margin: 0 0 50px 0;
    padding: 5px 30px;
    background: #0769bc;
    font-size: 1.5rem;
    text-align: center;
    color: #ffffff;   
}
.table_ex{
    width: 100%;
}
.table_ex dl{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    border-bottom: 1px solid #cccccc;
}
.table_ex dl dt{
    width: 30%;
    padding:25px;
    text-align: left;
    background: #dde6eb;
}
.table_ex dl dd{
    width: 70%;
    padding-left: 30px;
}
.table_ex dl dd a{
    color: #0769bc;
}
.table_ex dl dd a:hover{
    color: #cccccc;
}

/*ファブリック*/
.f_box2_fab{
    display: flex;
    justify-content: space-between;
    padding: 50px 0;
}
.f_box2_fab .box{
    width: 48%;
    padding: 0 20px;
}
.f_box2_fab .box h3{
    margin-bottom: 20px;
}
.f_box2_fab .box .img{
    width: 100%;
    margin-bottom: 10px;
}
.f_box2_fab .box .img img{
    width: 100%;
    height: auto;
}
.f_box2_fab .box p{
    text-align: left;
}

/*アルミ*/
.alimi_txt{
    width: 100%;
    margin-bottom: 50px;
    font-size: 1.5rem;
    color: #0768bb;
    font-weight: 800;
}

/* ------------CONTENTS 3------------ */

/*CPC ALE*/
.f_box3_ale{
    display: flex;
    flex-wrap: wrap;
}

.f_box3_ale .box{
    width: 50%;
    margin-bottom: 50px;
    padding: 0 20px;
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
}

.f_box3_ale .box h3{
    width: 100%;
    height: 50px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    font-size: 1.5rem;
    font-weight: 800;
    text-align: center;
    border-bottom: 1px solid #cccccc;
}
.f_box3_ale .box div{
    width: 50%;
}
.f_box3_ale .box div .img{
    width: 100%;
    max-width: 220px;
    margin: 0 auto;
}
.f_box3_ale .box:nth-child(3n) div .img{
    width: 230%;
    max-width: 480px;
    margin: 0 auto 30px 20%;
}
.f_box3_ale .box div .img img, .f_box3 .box div .img img{
    width: 100%;
    height: auto;
}
.f_box3_ale .box div h4, .f_box3_ale .box:nth-child(3n) div h4{
    width: 90%;
    margin: 0 auto 30px auto;
    padding: 3px 10px;
    display: block;
    text-align: center;
    color: #ffffff;
    background: #555555;
}
.f_box3_ale .box:nth-child(3n) div h4{
    margin: 0 auto 30px 50%;
}

.pa_cpcale{
    width: 100%;
    padding: 50px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    border: 1px solid #cccccc;
}
.pa_cpcale ul{
    width: 60%;
    display: flex;
    flex-wrap: wrap;
}
.pa_cpcale ul li{
    width: 45%;
    margin: 1%;
    padding: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #0769bc;
    color: #ffffff;
}
.pa_cpcale .img{
    width: 22%;
    padding-top: 5px
}
.pa_cpcale .img img{
    width: 100%;
    height: auto;
}

/*チタニア スカット*/
.f_box3_caw, .f_box3_ska{
    padding: 0 20px;
    margin-bottom: 50px;
    display: flex;
    justify-content: space-between;
}
.f_box3_caw div, .f_box3_ska div{
    width: 30%;
    display: flex;
    flex-direction: column;
}
.f_box3_caw div .box, .f_box3_ska div .box{
    width: 100%;
    margin-bottom: 20px;
    display: flex;
    flex-direction: row;
    flex-grow: 1;
}
.f_box3_caw div .box span{
    padding-right: 10px;
    display: block;
    font-size: 2.3rem;
    font-weight: 800;
    color: #0769bc;
    text-align: left;
}
.f_box3_caw div .img{
    width: 100%;
    padding: 25px;
    border: 1px solid #cccccc;
    flex-shrink: 0;
}
.f_box3_ska div .img{
    width: 100%;
    margin-bottom: 20px;
}
.f_box3_caw div .img img, .f_box3_ska div .img img{
    width: 100%;
    height: auto;
    flex-shrink: 0;
}
.f_box3_caw ul li{
    padding: 0 20px;
}

/*エクセル*/
.f_box3_ex{
    display: flex;
    justify-content: space-between;
}
.f_box3_ex .box{
    width: 45%;
    padding: 30px;
    border: 1px dotted #aaaaaa;
}
.f_box3_ex .box h3{
    width: 70%;
    margin: 0 auto 10px auto;
    padding: 5px 0;
    text-align: center;
    font-size: 1.3rem;
    font-weight: 800;
    color: #ffffff;
    background: #0769bc;
}
.f_box3_ex .box .img{
    width: 70%;
    margin: 0 auto 10px auto;
}
.f_box3_ex .box .img img{
    width: 100%;
    height: auto;
}
.f_box3_ex .box h4{
    width: 70%;
    margin: 0 auto 20px auto;
    padding: 5px 0;
    text-align: center;
    font-size: 1.3rem;
    font-weight: 800;
    border: 1px solid #cccccc;
}
.f_box3_ex .box p{
    width: 70%;
    margin: 0 auto 20px auto;
    padding: 5px 0;
    text-align: left;
    font-size: 0.9rem;
}

.ex_contact a{
    position: relative;
    display: block;
    width: 80%;
    margin: 0 auto 150px auto;
    max-width: 720px;
    padding: 30px 0;
    border: 1px solid #cccccc;
    text-align: center;
}
.ex_contact a span{
    position: absolute;
    top: 25px;
    right: 20px;
    transition: all 0.3s;
}
.ex_contact a:hover{
    color: #0769bc;
}
.ex_contact a:hover span{
    right: 10px;
}

/*ファブリック*/
.f_box3_fab{
    display: flex;
    justify-content: space-between;
}
.f_box3_fab .box{
    width: 48%;
    padding: 20px;
    border: 1px dotted #aaaaaa;
    text-align: center;
}
.f_box3_fab .box h3{
    margin: 0 0 30px 0;
    padding: 5px 0;
    font-size: 1.3rem;
    font-weight: 800;
    color: #ffffff;
    background: #0769bc;
}
.f_box3_fab .box h4{
    margin: 0 0 10px 0;
    font-weight: 800;
}
.f_box3_fab .box .img{
    width: 100%;
    margin: 0 0 10px 0;
}
.f_box3_fab .box .img img{
    width: 100%;
    height: auto;
}
.f_box3_fab .box p{
    margin-bottom: 20px;
}
.f_box3_fab .box p:last-child{
    text-align: left;
}

/* ------------CONTENTS 4------------ */

.f_box4_caw, .f_box4_caw_low{
    display: flex;
    justify-content: space-between;
    padding: 0 30px 30px 30px;
}
.f_box4_caw_low{
    margin: 0 30px 20px 30px;
    flex-wrap: wrap;
    border: 1px dotted #aaaaaa;
}
.f_box4_caw div{
    width: 48%;
    padding: 30px;
    border: 1px dotted #aaaaaa;
}
.f_box4_caw_low div{
    width: 48%;
}
.f_box4_caw div h3, .f_box4_caw_low h3{
    position: relative;
    padding-bottom: 20px;
    margin-bottom: 30px;
    border-bottom: 1px solid #cccccc;
    font-size: 1.2rem;
    font-weight: 800;
    text-align: center;
}
.f_box4_caw_low h3{
    width: 100%;
    padding-top: 30px;
}
.f_box4_caw div h3::before, .f_box4_caw_low h3::before{
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    display: block;
    width: 150px;
    height: 5px;
    background: #0769bc;
}
.f_box4_caw div h3::before {
    top: -31px;
}
.f_box4_caw_low h3::before {
    top: -1px;
}
.f_box4_caw div .img{
    width: 100%;
}
.f_box4_caw div .img img, .f_box4_caw_low div .img img{
    width: 100%;
    height: auto;
}
.note_right{
    padding-right: 30px;
    font-size: 0.9rem;
    text-align: right;
}

/* ------------CONTENTS 5------------ */
.f_box5_caw{
    text-align: center;
    margin-bottom: 100px;
}
.subheading{
    font-size: 1.2rem;
    font-weight: 800;
    color: #1E4FBB;
}
.f_box5_caw h3{
    font-size: 1.2rem;
    font-weight: 800;
    margin-bottom: 10px;
    text-align: center;
}
.f_box5_caw ul{
    margin-bottom: 50px;
}
.f_box5_caw ul li{
    text-indent: -6rem;
    padding-left: 6rem;
    text-align: left;
}
.f_box5_caw .figure_img{
    display: flex;
    justify-content: space-between;
    background: linear-gradient(to bottom, #0096e1, #0768bb);
    color: #ffffff;
}
.f_box5_caw .figure_img_low{
    background: linear-gradient(to bottom, #0096e1, #0768bb);
    color: #ffffff;
}
.f_box5_caw .figure_img div{
    width: 47%;
    padding: 30px;
}
.f_box5_caw .figure_img_low div{
    width: 100%;
    padding: 30px;
    margin-bottom: 70px;
}
.f_box5_caw .figure_img div h4, .f_box5_caw .figure_img_low div h4{
    padding: 5px 0;
    border: 1px solid #ffffff;
    margin-bottom: 20px;
}
.f_box5_caw .figure_img div .img, .f_box5_caw .figure_img_low div .img{
    margin: 0 auto;
    display: block;
}
.f_box5_caw .figure_img div .img{
    width: 78%;
}.f_box5_caw .figure_img_low div .img{
    width: 56%;
}
.f_box5_caw .figure_img div .img img, .f_box5_caw .figure_img_low div .img img{
    width: 100%;
    height: auto;
}
.annotation{
    padding: 20px 0;
    margin-bottom: 30px;
    border-top: 1px solid #cccccc;
    border-bottom: 1px solid #cccccc;
}

/*---------- Movie ----------*/
.movie{
    width: 100%;
	max-width: 560px;
    margin: 0 auto;
}


.lead{
    font-size: 1.2rem;
    padding: 0 20px;
}
.lead{
    font-size: 1.2rem;
    padding: 0 20px;
}

/*---------- レザーTXT 樹脂コート----------*/
.le_txt{
    padding: 0 100px;
}
.le_txt2{
    padding: 0 20px;
    text-align: center;
}

/* ---------- 施工実績 ----------*/
.p_container .achievement, .p_container .achievement_ex {
    position: relative;
    padding: 50px 20px;
    text-align: center;
}
.p_container .achievement::before, .p_container .achievement_ex::before {
    content: "";
    position: absolute;
    width: 30%;
    height: 5px;
    right: 0;
    left: 0;
    top: 0;
    margin: auto;
    background: #0769bc; 
}
.p_container .achievement p, .p_container .achievement_ex p{
    font-size: 2rem;
    font-weight: 800;
    margin-bottom: 50px;
    color: #333333;
}
.achievement .list, .achievement_ex .list{
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
}
.achievement .list{
    width: 1040px;
    margin-bottom: 20px;
}
.achievement_ex .list{
    width: 740px;
}
.list_left{
    justify-content: flex-start;
}
.list_center{
    justify-content: center;
}
.list_border{
    padding-bottom: 10px;
    border-bottom: 1px dotted #999999;
}
.achievement .list li{
    width: 333px;
    margin: 0 20px 20px 0;
}
.achievement_ex .list li{
    width: 233px;
    margin: 0 20px 20px 0;
}
.achievement .list li:nth-child(3n), .achievement_ex .list li:nth-child(3n){
    margin-right: 0;
}



/*お問い合わせ*/
/*-------------------------------------------------------*/
.contact_wrapper{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto 150px auto;
    padding: 0 20px;
}
.contact_wrapper .contact_box{
    margin-bottom: 50px;
}
.contact_wrapper h2{
    margin-bottom: 20px;
    font-size: 1.5rem;
    font-weight: 800;
}
.contact_wrapper .contact_Terms {
    margin-bottom: 30px;
    padding: 20px 0;
    border-top: 1px solid #cccccc;
    border-bottom: 1px solid #cccccc;
}
.contact_wrapper .contact_Terms h3, .contact_wrapper .contact_Terms h4{
    font-weight: 800;
}
.contact_wrapper .contact_Terms p{
    margin-bottom: 10px;
    text-indent: 1rem;
}
.contact_wrapper .contact_Terms p:nth-of-type(1){
    margin-bottom: 50px;
    text-indent: 0;
}
.contact_wrapper .consent_btn{
    margin-bottom: 50px;
    display: flex;
    justify-content: center;
}
.contact_wrapper .consent_btn_sm{
    display: none;
}
.contact_wrapper .consent_btn li, .contact_wrapper .consent_btn_sm li{
    width: 10rem;
    margin-right: 20px;
    font-size: 1.1rem;
    color: #ffffff;
    text-align: center;
    background-image:linear-gradient(to bottom, #666666, #333333);
    transition: all 0.3s;
}
.contact_wrapper .consent_btn li:last-child{
    margin-right: 0;
}
.contact_wrapper .consent_btn li a, .contact_wrapper .consent_btn_sm li a{
    padding: 5px 0;
    display: block;
}
.contact_wrapper .consent_btn li:hover{
    background-image:linear-gradient(to bottom, #0096e1, #0768bb);
}
.contact_wrapper .contact_ex, .contact_wrapper .contact_mail{
    margin-bottom: 30px;
    padding: 20px;
    border: 1px solid #cccccc;
    text-align: center;
}
.contact_wrapper .contact_ex h4, .contact_wrapper .contact_mail h4{
    margin-bottom: 15px;
    font-weight: 800;
    color: #0768bb;
}
.contact_wrapper .contact_ex p{
    font-size: 1.2rem;
    font-weight: 800;
}
.contact_wrapper .contact_ex p:last-child{
    font-size: 1rem;
    font-weight: normal;
}

/*サイトマップ*/
/*-------------------------------------------------------*/
.site_map_wrapper{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto 150px auto;
    padding: 0 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.site_map_wrapper .box{
    width: 100%;
    margin-bottom: 50px;
}
.site_map_wrapper .box_s{
    width: 48%;
}
.site_map_wrapper .box h2, .site_map_wrapper .box_s h2{
    margin-bottom: 10px;
    padding: 0 0 10px 50px;
    position: relative;
    font-size: 1.5rem;
    font-weight: 800;
    border-bottom: 1px solid #cccccc;
}
.site_map_wrapper .box h2 a, .site_map_wrapper .box_s h2 a{
    display: block;
    transition: all 0.3s;
}
.site_map_wrapper .box h2 a:hover, .site_map_wrapper .box_s h2 a:hover{
    color: #0769bc;
}
.site_map_wrapper .box h2::after, .site_map_wrapper .box_s h2::after{
    content: "";
    width: 40px;
    height: 6px;
    position: absolute;
    top: 35%;
    left: 0;
    background: #0769bc;
}
.site_map_wrapper .box p{
    margin-bottom: 30px;
    padding-left: 20px;
    color: #777777;
}
.site_map_wrapper .box ul{
    padding-left: 60px;
    display: flex;
    flex-wrap: wrap;
}
.site_map_wrapper .box ul li{
    width: 30%;
    margin-bottom: 20px;
    padding: 0 0 5px 10px;
    position: relative;
}
.site_map_wrapper .box ul li a{
    display: block;
}
.site_map_wrapper .box ul li::before{
    content: "";
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 0;
    border-bottom: 1px solid #0768bb;
    transition: all 0.3s;
}
.site_map_wrapper .box ul li:hover::before{
    width: 80%;
}

/*ニュースページ*/
/*-------------------------------------------------------*/
.news_wrapper{
    width: 100%;
    max-width: 1100px;
    margin: 0 auto 150px auto;
    padding: 0 20px;
}
.news_wrapper .head{
    margin-bottom: 20px;
    display: flex;
    justify-content: space-between;
}
.news_wrapper .head p:first-child{
    background: #0096e1;
    padding: 0 30px;
    font-size: 0.8rem;
    color: #ffffff;
}
.news_wrapper .head p:last-child{
    font-size: 0.8rem;
    color: #666666;
}
.news_wrapper .head .new{
    position: relative;
	margin-left: 50px;
}
.news_wrapper .head .new::after {
	content: "NEW";
	position: absolute;
    top: 0;
	left: -50px;
	display: inline-block;
	padding: 0 8px;
	background: #0765B6;
	font-size: 0.8rem;
	color: #ffffff;
}
.news_wrapper h2{
    margin-bottom: 15px;
    padding-bottom: 15px;
    font-size: 1.5rem;
    font-weight: 800;
    border-bottom: 1px solid #cccccc;
}
.news_wrapper a:hover{
    color: #0096e1;
}

@media screen and (min-width: 10px) and (max-width: 1100px) {


/*ソリューション*/
/*-------------------------------------------------------*/   

/* ----------ソリューションTOP---------- */
.sol_top .sol_top_btn{
    width: 49%;
}
.sol_top .sol_top_btn h3{
    margin-bottom: 10px;
    padding-bottom: 10px;
    font-size: 1.2rem;
}
    
/* ------------CONTENTS 1------------ */
.solution1{
    background: url("../solution/images/bg_f.png");
    background-repeat: no-repeat;
    background-position: top+150px right;
    background-size: 700px auto;
}
.solution1 .headline1{
    width: 140px;
    height: 300px;
}
.solution3 .box .figure_img div .box_titania p{
    text-align: left;
}
.solution3 .box .figure_img div .box_titania p br{
    display: none;
}
    
/*製品について*/
/*-------------------------------------------------------*/
.p_container .inner h2{
    width: 100%;
    margin: 0 0 50px 0;
    font-size: 3.7vw;
}
.patent h3{
    font-size: 1.8rem;
}
    
/* ------------CONTENTS 1------------ */

/*CPC ALE , チタニア*/
    
/*CPC ALE, チタニア ,エクセルピュア*/
.f_box_ex div{
    width: 49%;
    margin-bottom: 20px;
}
.f_box_ex div span{
    width: 90%;
}
.f_box_ex h3{
    width: 100%;
    margin-bottom: 50px;
    font-size: 2rem;
    color: #0768bb;
    font-weight: 800;
    text-align: center;
}
    
/*エクセルピュア */
.patent{
    background-size: 150% auto;
}
.patent h3{
    font-size: 1.8rem;
}
.patent div{
    width: 50%;
}
.ex_list li{
    text-indent: -1rem;
    padding-left: 1rem;
}

/* ------------CONTENTS 2------------ */    

/*チタニア*/
.f_box2 div .siaa_img{
    width: 86%;
}

/* ------------CONTENTS 3------------ */

/*エクセル*/
.f_box3_ex .box .img{
    width: 86%;
}

/* ------------CONTENTS 4------------ */
.solution4 .construction_img{
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}
.solution4 .construction_img li{
    width: 31%;
    margin: 0 1% 20px 0;
}
.solution4 .construction_img li:nth-child(3n){
    margin-right: 20px;
}
.solution4 .construction_img li span{
    display: block;
    margin-bottom: 10px;
}
 
/* 製品ロゴ */
.solution4 .rogo_list{
    width: 100%;
}
.rogo_list_left{
    justify-content: flex-start;
}
.rogo_list_center{
    justify-content: center;
}
.solution4 .rogo_list li{
    width: 48%;
    margin-right: 2%;
}
.solution4 .rogo_list li:nth-child(3n){
    margin-right: 2%;
}
.solution4 .rogo_list li:nth-child(even){
    margin-right: 0;
}

/* ---------- 施工実績 ----------*/
.achievement .list{
    width: 100%;
    margin: 0 auto 20px auto;
    display: flex;
    flex-wrap: wrap;
}
.list_left{
    justify-content: flex-start;
}
.list_center{
    justify-content: center;
}
.achievement .list li{
    width: 48%;
    margin-right: 2%;
}
.achievement .list li:nth-child(3n){
    margin-right: 2%;
}

/*サイトマップ*/
/*-------------------------------------------------------*/
.site_map_wrapper .box ul{
    padding-left: 10px;
    display: flex;
    flex-wrap: wrap;
}
.site_map_wrapper .box ul li{
    width: 33%;
}

    
}

@media screen and (min-width: 10px) and (max-width: 768px) {

/*PAGE HEAD*/
/*-------------------------------------------------------*/

.page_head::before{
    width: 100%;
    height: 130%;
}

.page_head .inner .c_headline{
    width: 86%;
    font-size: 1.7rem;
}
.page_head .inner h1{
    font-size: 1.2rem;
}

.head_row{
    width: 180px;
    margin: 0 auto 150px auto;
}

/*PAGE TITL LEAD*/
/*-------------------------------------------------------*/
.t_lead{
    text-align: left;
}
.t_lead br{
    display: none;
}
.t_lead h2{
    font-size: 1.2rem;
}
.t_lead h2 span{
    display: inline;
}
.t_lead .name{
    width: 60%;
}
.t_lead .name2{
    width: 45%;
}
.t_lead .name3{
    width: 80%;
}
.t_lead .name img, .t_lead .name2 img, .t_lead .name3 img{
    width: 100%;
    height: auto;
}
.t_lead .box{
    flex-wrap: wrap;
}
.t_lead .box li{
    width: 48%;
    margin-right: 3%;
    font-size: 1rem;
}

/*ソリューション*/
/*-------------------------------------------------------*/
.sol_titl{
    text-align: left;
}
.sol_top_titl h2{
    font-size: 1.5rem;
    text-align: left;
}
.sol_top_titl h2 br{
    display: none;
}
.sol_titl h2{
    font-size: 2rem;
    background: none;
}
.sol_titl p{
    font-size: 1rem;
}
.sol_titl p br{
    display: none;
}
    
/* ----------ソリューションTOP---------- */
.sol_top .sol_top_btn{
    width: 100%;
}
.sol_top .sol_top_btn h3{
    margin-bottom: 10px;
    padding-bottom: 10px;
    font-size: 1.2rem;
}
    
/* ------------CONTENTS 1------------ */
.solution1{
    background: url("../solution/images/bg_f.png");
    background-repeat: no-repeat;
    background-position: top+150px right;
    background-size: 600px auto;
}
.solution1 .headline1{
    width: 110px;
    height: 290px;
}
.solution1 .headline1 div span{
    font-size: 1.6rem;
    line-height: 2rem;
}
.solution1 .headline2{
    width: 58%;
    margin-bottom: 50px;
    padding: 0 0 0 3%;
}
.solution1 .headline2 h2{
    font-size: 1.8rem;
    line-height: 2rem;
}
.solution1 .box div, .solution1 .box_single div{
    width: 100%;
    padding: 0 0 0 50px;
}

/* ------------CONTENTS 2------------ */
.solution2_line{
    background-size: 80% 15px, 132px auto;
    background-position: top+80px left, top+80px right+20%;
}
.solution2 .headline01, .solution2 .headline02, .solution2 .headline03, .solution2 .headline04, .solution2 .headline05, .solution2 .headline06{
    margin: 0 0 50px 20px;
    padding: 0 7% 50px 0;
}
.solution2 .headline01 h2, .solution2 .headline02 h2, .solution2 .headline03 h2, .solution2 .headline04 h2, .solution2 .headline05 h2, .solution2 .headline06 h2{
    font-size: 3rem;
    line-height: 3rem;
}
.solution2 .headline01 h2::before, .solution2 .headline02 h2::before, .solution2 .headline03 h2::before, .solution2 .headline04 h2::before, .solution2 .headline05 h2::before, .solution2 .headline06 h2::before{
    top: -35px;
    font-size: 0.8rem;
}   
.solution2 .box {
    flex-wrap: wrap;
}
.solution2 .box div{
    width: 100%;
    margin-bottom: 40px;
}

.solution2 .box div .head{
    margin-bottom: 20px;
}
.solution2 .box div .head .number {
    width: 120px;
    padding-top: 40px;
    font-size: 5.5rem;
    line-height: 5.5rem;
}
.solution2 .box div .head h3{
    font-size: 1.2rem;
} 
.solution2 .box div p{
    position: relative;
} 
.solution2 .box div p::after{
    content: "";
    position: absolute;
    bottom: -20px;
    left: 0;
    width: 76%;
    height: 1px;
    background: #cccccc;
}
    
/* ------------CONTENTS 3------------ */
    
.solution3 {
    padding: 100px 0 0 0;
    background-size: 147px auto;
}
.solution3 h2{
    font-size: 1.5rem;
    text-align: left;
}
.solution3 .box{
    padding: 50px 20px 0 20px;
    text-align: center;
}
.solution3 .box .head div img{
    width: 180px;
    height: auto;
}
.solution3 .box .head h3{
    font-size: 1.2rem;
    text-align: left;
}
.solution3 .box .head .so3_lead, .solution3 .box .head .so3_txt {
    font-size: 1rem;
    text-align: left;
}
.solution3 .box .head .so3_txt br {
    display: none;
}
.solution3 .box .head .subheading{
    font-size: 1.2rem;
}

.solution3 .box ul{
    padding: 0;
}
.solution3 .box .figure_img{
    display: block;
}
.solution3 .box .figure_img .arrow{
    width: 40px;
    margin: 0 auto;
    transform: rotate( 90deg );
}
.solution3 .box .figure_img div{
    width: 100%;
    padding: 15px 0;
}
.solution3 .box .figure_img div p{
    text-align: left;
}
.indent_sol3{
    text-indent: -8.5rem;
    padding-left: 8.5rem;
}
.solution3 .box .figure_img div .img{
    width: 90%;
}

.solution3 .box .data_ale div{
    width: 100%;
    display: block;
}
.solution3 .box .data_ale h4{
    width: 100%;
}
.solution3 .box .data_ale div dl{
    width: 100%;
    display: flex;
    border-bottom: 1px solid #bbbbbb;
}
.solution3 .box .data_ale div dl:nth-child(1), .solution3 .box .data_ale div dl:nth-child(2){
    border-top: 0px solid #dddddd;
}
.solution3 .box .figure_img div .static_txt{
    width: 90%;
}

/* ------------SOLUTION------------ */
.sol_ect{
    font-size: 1.3rem;
    text-align: left;
}
    
/* ------------CONTENTS 4------------ */
.solution4 {
    position: relative;
}
.solution4 h2{
    font-size: 1.5rem;
}
.solution4 .construction_img{
    width: 100%;
    display: block;
}
.solution4 .product_img{
    display: block;
}
.solution4 .construction_img li{
    width: 90%;
    margin: 0 auto 30px auto;
}

/* 製品ロゴ */
.solution4 .rogo_list{
    width: 100%;
}
.solution4 .rogo_list li{
    width: 100%;
    margin-right: 0%;
}
.solution4 .rogo_list li:nth-child(3n){
    margin-right: 0%;
}
    
/*製品について*/
/*-------------------------------------------------------*/
.p_container .inner h2{
    font-size: 3.7vw;
    margin: 0 0 30px 0px;
}
    
/* ----------製品TOP---------- */
.pro_top .inner .pro_top_btn{
    width: 100%;
}
.pro_top .inner .pro_top_btn h3{
    margin-bottom: 10px;
    padding-bottom: 10px;
    font-size: 1.2rem;
}

/* ------------CONTENTS 1------------ */

/*CPC ALE , チタニア*/
.img_frame_w img{
    width: 98%;
}
.img_frame{
    width: 90%;
}
.img_frame_alumi{
    width: 90%;
}
.img_frame::after{
    padding: 0 0 0 5px;
    bottom: 0;
    left: 0;
    font-size: 0.8rem;
    text-align: left;
}
.img_frame::before{
    padding: 0 5px 0 0;
    bottom: 0;
    right: 0;
    font-size: 0.8rem;
    text-align: right;
}
.t_box{
    padding: 0 2rem;
}

/*CPC ALE, チタニア ,エクセルピュア*/
.f_box_ex div{
    width: 100%;
    margin-bottom: 20px;
}
.f_box_ex h3{
    font-size: 1.3rem;
    text-align: left;
}
.f_box, .f_box_ex{
    display: block;
    padding-bottom: 1px;
}
    
.f_box div{
    width: 100%;
    margin-bottom: 30px;
    padding: 50px 30px 50px 50px;
}
.f_box div .ale, .f_box div .caw{
    font-size: 1.2rem;
}
.f_box div .ale span, .f_box div .caw span{
    top: -25px;
    left: -35px;
    font-size: 2.5rem;
}
.f_box div .ale::after, .f_box div .caw::after{
    top: -13px;
    font-size: 0.6rem;
}
.f_box div .ale::before, .f_box div .caw::before{
    width: 65%;
}  
    
/*エクセルピュア */
.patent{
    background-size: 200% auto;
}
.patent h3{
    font-size: 1.1rem;
    font-weight: 800;
    margin-bottom: 30px;
}
.patent div{
    width: 80%;
    font-size: 0.9rem;
}
.ex_list{
    padding: 0 30px 30px 30px;
}
.ex_list li{
    width: 100%;
    margin: 0 0 20px 0;
}
.ex_list li:nth-child(even){
    margin: 0 0 20px 0;
}
    
/* ------------CONTENTS 2------------ */

/*CPC ALE, チタニア*/
.f_box2{
    display: block;
}
.f_box2 div{
    width: 100%;
    margin-bottom: 50px;
    padding: 20px;
    border: 1px dotted #aaaaaa;
    border-left: 0;
    border-right: 0;
}
.f_box2 div h3{
    font-size: 1.1rem;
}
.f_box2 div h3::before{
    top: -21px;
    width: 50%;
}
    
/*EX*/
.table_ex dl{
    display: block;
    border: 0;
}
.table_ex dl dt{
    width: 100%;
    padding:5px;
    text-align: center;
}
.table_ex dl dd{
    width: 100%;
    padding: 15px;
}

/*ファブリック*/
.f_box2_fab{
    display: block;
    padding: 0 0 50px 0;
}
.f_box2_fab .box{
    width: 100%;
    margin-bottom: 50px;
}
    
/* ------------CONTENTS 3------------ */

/*チタニア*/
.f_box3_caw, .f_box3_ska{
    display: block;
}
.f_box3_caw div, .f_box3_ska div{
    width: 100%;
    margin-bottom: 50px;
    padding: 0 10px;
    display: block;
}
.f_box3_caw div .box span{   
    font-size: 2rem;
    text-align: left;
}
.f_box3_caw div .img{
    width: 70%;
    margin: 0 auto;
    padding: 0;
    border: 0px solid #cccccc;
}
.f_box3_ska div .img{
    width: 100%;
    padding: 0;
}

/*CPC ALE*/
.f_box3_ale{
    display: block;
}

.f_box3_ale .box{
    width: 100%;
    margin-bottom: 50px;
    display: block;
}
.f_box3_ale .box h3{
    width: 100%;
    height: 40px;
    margin-bottom: 10px;
    font-size: 1.2rem;
}
.f_box3_ale .box div{
    width: 100%;
    margin-bottom: 30px;
}
.f_box3_ale .box:nth-child(3n) div .img{
    width: 100%;
    max-width: 480px;
    margin: 0 auto 30px auto;
}

.f_box3_ale .box div h4, .f_box3_ale .box:nth-child(3n) div h4{
    width: 80%;
}
.f_box3_ale .box:nth-child(3n) div h4{
    margin: 0 auto 30px auto;
}

.pa_cpcale{
    width: 100%;
    padding: 20px;
    flex-wrap: wrap;
    border-left: 0;
    border-right: 0;
}
.pa_cpcale ul{
    width: 100%;
    margin-bottom: 30px;
    display: block;
}
.pa_cpcale ul li{
    width: 100%;
    margin: 0 0 20px 0;
    padding: 20px;
    justify-content: flex-start;
}
.pa_cpcale .img{
    width: 54%;
}

/*エクセル*/
.f_box3_ex{
    padding: 0px;
    display: block;
}
.f_box3_ex .box{
    width: 100%;
    border-right: 0;
    border-left: 0;
}
.f_box3_ex .box:first-child{
    margin-bottom: 30px;
}
.f_box3_ex .box h3{
    width: 100%;
}
.f_box3_ex .box .img{
    width: 100%;
}
.f_box3_ex .box h4{
    width: 100%;
}
.f_box3_ex .box p{
    width: 100%;
}
.ex_contact a{
    width: 90%;
}
.ex_contact a span{
    right: 15px;
}
.ex_contact a span img{
    width: 95%;
    height: auto;
}
.ex_contact a:hover{
    color: #333333;
}
.ex_contact a:hover span{
    right: 20px;
}
    
/*ファブリック*/
.f_box3_fab{
    display: block;
}
.f_box3_fab .box{
    width: 100%;
    margin-bottom: 50px;
    padding: 20px;
    border: 0;
}
.f_box3_fab .box h3{
    font-size: 1.2rem;
}
.f_box3_fab .box h4{
    text-align: left;
}
.f_box3_fab .box p{
    text-align: left;
}
    
/* ------------CONTENTS 4------------ */

.f_box4_caw, .f_box4_caw_low{
    display: block;
    padding: 0px;
}
.f_box4_caw_low{
    margin: 0 0 20px 0;
    border: 1px dotted #aaaaaa;
}
.f_box4_caw div{
    width: 100%;
    margin-bottom: 50px;
    padding: 20px;
    border-left: 0;
    border-right: 0;
}
.f_box4_caw_low div{
    width: 100%;
    padding: 0 20px;
    margin-bottom: 50px;
}

.f_box4_caw_low h3{
    width: 100%;
}
.f_box4_caw div h3::before {
    top: -21px;
}
.note_right{
    padding-right: 30px;
    font-size: 0.9rem;
    text-align: right;
}

/* ------------CONTENTS 5------------ */
.f_box5_caw{
    text-align: left;
    margin-bottom: 70px;
}
.subheading{
    font-size: 1.1rem;
    padding: 0 20px;
}
.f_box5_caw ul{
    margin-bottom: 30px;
}
.f_box5_caw .figure_img{
    display: block;
    padding: 30px 0;
}
.f_box5_caw .figure_img div{
    width: 100%;
    padding: 20px;
    margin-bottom: 30px;
}
.f_box5_caw .figure_img_low div{
    width: 100%;
    padding: 20px;
}
.f_box5_caw .figure_img div h4, .f_box5_caw .figure_img_low div h4{
    text-align: center;
}
.f_box5_caw .figure_img div .img, .f_box5_caw .figure_img_low div .img{
    width: 90%;
}
.annotation{
    padding: 20px 20px;;
    margin-bottom: 30px;
    border-top: 1px solid #cccccc;
    border-bottom: 1px solid #cccccc;
}
    
/*---------- Movie ----------*/
.movie {
    position: relative;
    height: 0;
    padding: 30px 0 56.25%;
    overflow: hidden;
}
.movie iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
    
.lead{
    text-align: left;
}

/*---------- レザーTXT 樹脂コート----------*/
.le_txt{
    padding: 0 20px;
}
.le_txt2{
    text-align: left;
}
    
/* ---------- 施工実績 ----------*/
.p_container .achievement p, .p_container .achievement_ex p{
    font-size: 1.5rem;
}
.achievement .list{
    display: block;
}
.achievement_ex .list{
    width: 100%;
    display: flex;
}
.achievement .list li{
    width: 100%;
    margin-right: 0%;
}
.achievement_ex .list li{
    width: 50%;
    margin-right: 0%;
}
.achievement .list li:nth-child(3n), .achievement_ex .list li:nth-child(3n){
    margin-right: 0;
}
    
/*お問い合わせ*/
/*-------------------------------------------------------*/
.contact_wrapper h2{
    font-size: 1.2rem;
}
.contact_wrapper .consent_btn{
    display: none;
}
.contact_wrapper .consent_btn_sm{
    margin-bottom: 50px;
    display: flex;
    justify-content: center;
}
.contact_wrapper .consent_btn li, .contact_wrapper .consent_btn_sm li{
    width: 38%;
    font-size: 1rem;
}
.contact_wrapper .contact_ex p, .contact_wrapper .contact_mail p{
    font-size: 1rem;
    text-align: left;
}
    
/*サイトマップ*/
/*-------------------------------------------------------*/
.site_map_wrapper{
    justify-content: space-between;
}
.site_map_wrapper .box h2, .site_map_wrapper .box_s h2{
    padding: 0 0 10px 40px;
    font-size: 1.2rem;
}
.site_map_wrapper .box h2 a:hover, .site_map_wrapper .box_s h2 a:hover{
    color: #333333;
}
.site_map_wrapper .box h2::after, .site_map_wrapper .box_s h2::after{
    top: 25%;
    width: 30px;
}
.site_map_wrapper .box p{
    padding-left: 0;
}
.site_map_wrapper .box ul{
    padding-left: 0px;
}
.site_map_wrapper .box ul li{
    width: 100%;
}
.site_map_wrapper .box ul li:hover::before{
    width: 0;
}

/*---------- youtubu ----------*/
.video {
    position: relative;
    height: 0;
    padding: 30px 0 56.25%;
    overflow: hidden;
}
.video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
    
}