@charset "UTF-8";

@media screen and (max-width:1400px) {
#main_contents_kaso #strength .txt_area .point {top: 40px; left: 40px;}
#main_contents_kaso #strength .box_panel .point_txt {left: 40px; bottom: 70px;}
.pc_wide{ display: none; }
}
@media screen and (max-width:1300px) {
#main_contents #products .cont_area .products_box .txt_box {width: 37.5%; min-height: 410px; padding: 30px;}
#main_contents_kaso #flow .flow_box .txt_area .inner {padding: 0 40px;}
#main_contents_kaso #flow .flow_box .txt_area .flow_ttl {margin-top: 27px;}
#main_contents_kaso #flow .flow_box .txt_area .flow_txt {margin-top: 30px;}
}
@media screen and (max-width:1100px) {
#main_contents .cont_area .copy_area .main_txt { font-size: 5.4rem; line-height: 1.5; letter-spacing: 0.5rem;}
#main_contents_kaso #strength .txt_area .point {top: 30px; left: 30px;}
#main_contents_kaso #strength .box_panel .point_txt {left: 30px; bottom: 30px;}
#main_contents #products .cont_area .products_box .txt_box {position: absolute; width: 37.5%; height: auto; min-height: 360px; bottom: -70px; padding: 30px;}
#main_contents #products .cont_area .txt_box .inner {height: auto; position: relative; top: 0; transform: none;}
#main_contents_kaso #flow .flow_box .txt_area .inner {top: 50%;}
.num_ttl{ display: flex; align-items: center; }
#main_contents_kaso #flow .flow_box .txt_area .flow_ttl {padding: 3px 10px 4px; margin: 2px 0 0 13px;}
#main_contents_kaso #flow .flow_box .txt_area .flow_txt {margin-top: 12px;}
}
@media screen and (max-width:1024px) {
#main_contents_kaso #about .cont_area {padding: 70px 0;}
#main_contents_kaso #contact_area .cont_area .contact_wrap {padding: 38px 30px 40px;}
#main_contents_kaso #contact_area .cont_area dd {margin-left: 270px;}
}

@media screen and (max-width:1023px) {

footer .ft-inner { background-color: #d7d7d7; padding: 6rem 3rem 5rem ; }
footer #page-top { position: fixed; right:2.5rem; bottom: 20rem ;}

/* TOP */

#main_contents section .wrapper{ max-width: none; padding: 0 50px; } 
#main_contents section h2{ font-size: 5.6rem; letter-spacing: 0.3rem;}
#main_contents section .jpn_ttl{ font-size: 1.7rem; line-height: 1.4; /*margin-top: 35px;*/ }

#main_contents .cont_area{ position: relative; margin:60px auto 0; display: block; width: 100%;}
#main_contents .cont_area .copy_area{ width: 100%;}

#main_contents .cont_area .copy_area .main_txt { font-size: 4.8rem; line-height: 1.5; letter-spacing: 0.4rem;}
#main_contents .cont_area .copy_area .sub_txt{ font-size: 1.8rem; line-height: 1.9; margin-top: 40px;}

#main_contents .cont_area .logo_img{ position: absolute; right: 0; bottom: 0; width:20%; max-width:200px; height: auto; vertical-align: bottom;}
#main_contents .cont_area .logo_img img{ width:100%; height: auto;}

.more_btn{ width:420px; height: 70px; margin: 70px auto 0;}
.more_btn a{ display: inline-block; width:420px; height: 70px; font-size: 1.8rem; padding: 25px 10px 27px; text-align: center; border-radius: 10px; }


}


@media screen and (max-width:960px) {

.tab{ display: none; }

footer {padding-top: 14rem;}
footer .ft-contact {padding: 5rem 5rem 7rem;}
footer .ft-contact p.txt { margin-bottom: 3.5rem; }

footer { padding-top: 80px;}
footer .ft_inner { padding: 50px 20px 50px 20px; margin: 0 auto; }
footer .ft_inner .wrapper{ position: relative; display:block; width: 100%; max-width: none ; margin:0 auto; padding: 0; text-align: center;}
footer .ft_inner .ft_menu { display:block; margin: 0 auto 40px; width: 100%; max-width: 800px; }
footer .ft_inner .ft_menu nav.fnav { padding: 0 ; margin: 0 auto; text-align: center;}
footer .ft_inner .ft_menu nav.fnav ul { display:inline; margin: 0 auto; }
footer .ft_inner .ft_menu nav.fnav ul li { line-height:2.2; letter-spacing: 0.2rem; margin-right: 30px; text-align: center; }
footer .ft_inner .ft_menu nav.fnav ul li:last-child { margin-right: 0; }
footer .ft_inner .ft_menu nav.fnav ul li a{ font-size: 1.8rem; }
footer .ft_inner .ft_address .ft_logo { width: 182px; margin: 0 auto 17px;}
footer .ft_inner .ft_address p.fadd { display: block; text-align: center; margin-bottom: 40px; }
footer .ft_inner .copyright { display: inline; position: relative; }
footer .ft_inner .copyright p { text-align: center; font-size: 1.1rem; }
footer #page_top { top: -120px;}


#main_contents #entry .wrapper { padding: 100px 60px; }


#main_contents_kaso section .wrapper {max-width: none;padding: 0 40px;}

.cont_area .copy_area .sub_txt{ text-align: left;}

.company_block{
display: -ms-grid; 
display: grid; 
grid-gap: 30px 3.5%; 
-ms-grid-columns: 1fr; 
grid-template-columns: repeat(1, 1fr); 
-ms-grid-rows: auto 30px auto; 
grid-template-rows: repeat(2, auto);
}.company_block > *:nth-child(1){
-ms-grid-row: 1;
-ms-grid-column: 1;
}.company_block > *:nth-child(2){
-ms-grid-row: 3;
-ms-grid-column: 1;
}


}

@media screen and (max-width:900px) {

.main_img { min-height: 720px; }
.main_img img { min-height: 670px; }

}

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

.sp{ display: block; }
.pc{ display: none; }

header { height: 9.5rem; }
header .inner h1 img { top: 1.9rem; left: 3rem; width: 7.5rem; }

.main_img img { min-height: 670px; }

/* KASO ======================================================================================================================== */

#main-contents_kaso section h2 { margin-bottom: 11rem; }

#main_contents_kaso #main_img { margin-bottom: 70px;}
#main_contents_kaso #main_img:after {background: linear-gradient(180deg,transparent 80%,#333 100%,#333); }
#main_contents_kaso #main_img img{ width:100%; height:auto; max-height: none ; object-fit: cover; }

#main_contents_kaso #main_img .ttl_area{ bottom: 30px; left:30px;}
#main_contents_kaso #main_img .jpn_ttl{ position: relative; display: inline-block; font-size: 1.7rem; line-height: 1.4; color:#fff; background: #cb000f; letter-spacing: 0.3rem; margin-bottom: 11px; padding: 0 7px 1px 13px; }
#main_contents_kaso #main_img .jpn_ttl::after{ content: ""; position: absolute; top: 0; left: 100%; width: 0; height: 0; border-left:10px solid #cb000f; border-top:12px solid transparent; border-bottom:12px solid transparent; }
#main_contents_kaso #main_img .eng_ttl{ font-size: 4.6rem; letter-spacing: 0.3rem;}

#main_contents_kaso .under{ padding:50px 0 0 ; margin-top: 50px;}

#main_contents_kaso section .wrapper{ max-width: none; padding: 0 30px; } 
#main_contents_kaso section .wrapper .ttl_area{text-align: center;}
#main_contents_kaso section h2{ font-size: 4.8rem; letter-spacing: 0.3rem;}
#main_contents_kaso section .cont_area .copy_area{ text-align: left;}
#main_contents_kaso section .copy_area .main_txt{ font-size: 2.6rem; margin-top:40px;}
#main_contents_kaso section .copy_area .sub_txt{ margin-top:25px; }
#main_contents_kaso section .cont_area p{ font-size: 1.6rem; line-height: 1.8; letter-spacing: 0.1rem;}
#main_contents_kaso section .jpn_ttl{ font-size: 1.6rem; line-height: 1.3; letter-spacing: 0.3rem; margin-top: 15px;}

#main_contents_kaso .service { background-image: url(../img/service/service_main_img_sp.jpg);}

.cont_area .second_btn {margin: 15px auto 0;}

#main_contents_kaso .company { background-image: url(../img/company/company_main_img_sp.jpg); }
.message_area {display: block; width: 100%; align-items: center; margin: 50px auto 0;}
.message_area .message_img {width: 85%; min-width: 0; max-width: 420px; margin: 0 auto 40px ;}
.message_txtbox {width: 100%; padding: 30px 20px 32px;}
.message_txtbox::before {top: -52px; right: 50%; transform: translateX(50%); border-bottom: 26px solid #fae9ea; border-left: 26px solid transparent; border-right: 26px solid transparent;}
#main_contents_kaso #about .cont_area {padding: 40px 0 0;}
.cont_area dl {margin-bottom: 20px;}
.cont_area dt {float: none; line-height: 2.2;}
.cont_area dd {margin-left: 0; margin-bottom: 25px;}
#main_contents_kaso #access .cont_area .map_box {margin-top: 47px;}

#main_contents_kaso .recruit { background-image: url(../img/recruit/recruit_main_img_sp.jpg); }
.movie_wrap {margin-top: 50px;}
.item_box {margin-top: 45px;}
.line_ttl {padding: 12px 20px 13px;}
.item_box .inner {display: block; margin-top: 40px;}
.item_box .fig_img {width: 100%;}
#main_contents_kaso #result .item_box .copy_area {width: 100%; margin-left: 0;}
.item_box .info_box {width: 100%; margin: 0 0 30px;}
#recruit_info .item_box .txt_area {padding: 45px 0;}
#main_contents_kaso #recruit_info .recruit_box {padding: 0;}
.btn_block {margin-top: 60px;}
.btn_block .btn_copy {text-align: left;}

#main_contents_kaso .contact { background-image: url(../img/contact/contact_main_img_sp.jpg); }
#main_contents_kaso #contact_area .cont_area form {margin-top: 45px;}
#main_contents_kaso #contact_area .cont_area .contact_wrap {border-top: 1px solid #efefef; padding: 23px 0 30px;}
#main_contents_kaso #contact_area .cont_area dt {margin-bottom: 7px;}
#main_contents_kaso #contact_area .cont_area dd {margin-left: 0;}
#main_contents_kaso #contact_area .cont_area input {max-width: none; line-height: 3.4;}
#main_contents_kaso #contact_area .cont_area textarea {width: 100%; height: 340px;}
#main_contents_kaso #contact_area .policy {padding: 30px 26px 30px; }
.btn_area{ max-width:none; width:100%; height: 60px; margin: 50px auto 0;}
#main_contents_kaso button { max-width:none; width:100%; height: 60px; }

}

@media screen and (max-width:767px) {

header { width: 100%; height: 7rem; }
header .inner { min-width:28rem; }
header .inner h1 img { position: absolute; top: 1.5rem; left: 1.7rem; width: 5.5rem; height:auto; }

.menu_sp{ display: block; }

header nav{ display:none; transition: 0.5s ease-in-out; }
header.open nav{ transition: 0.5s ease-in-out; display: block; position: fixed; top:0; left: 0; width: 100%; height: 100%; background:rgba(230, 243, 255, 0.96); z-index: 100; }
header.open nav .navi{ display: block; width: 90%; height: 12rem; position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; margin: auto; }
header.open nav .navi .navi-inner{ margin: 0 auto; text-align: center; }
header.open nav ul li:last-child{ border: none; }
header.open nav .navi .navi-inner a{ display: block; color: #00397a; text-decoration: none; padding: 16px; font-size: 3.2rem; margin-right: 0;}
header.open nav .navi .navi-inner a::after { height: 0rem;}

/* spmenu */
#nav_toggle{ display: block; width: 50px; height: 50px; position:fixed; /*position: absolute; top: 50%;*/ top: 0; right: 6px; /*transform: translateY(-65%);*/ transform: translateY(2%);  z-index: 250; cursor: pointer; }
#nav_toggle div { position: relative; width: 20px; height: 50px; margin: 0 auto; }
#nav_toggle span{ display: block; height: 2px; background: #00397a; position:absolute; width: 100%; left: 0; transition: 0.5s ease-in-out; opacity: 1;}
#nav_toggle span:nth-child(1){ top:1.9rem; }
#nav_toggle span:nth-child(2){ width: 90%; top:2.6rem; }
#nav_toggle span:nth-child(3){ width: 75%; top:3.3rem; }
#nav_toggle div p{ position: absolute; color:#00397a; font-size: 0.8rem; top:4rem; left:50%; transform: translateX(-50%); }
.open #nav_toggle { position:fixed; }
.open #nav_toggle span:nth-child(1) { top: 23px; transform: rotate(135deg); }
.open #nav_toggle span:nth-child(2) { top: 23px; width: 100%; transform: rotate(-135deg); }
.open #nav_toggle span:nth-child(3) { top: 23px; width: 100%; opacity: 0; transform: rotate(135deg); }


#main_contents #about { padding: 120px 0; }
#main_contents .cont_area .copy_area .main_txt { text-align: left;}

#main_contents #entry { padding: 120px 20px 150px; }

#main_contents #entry .wrapper { padding: 70px 40px; }

}


@media screen and (max-width:667px) {

header .inner .logo img {left: 20px; width: 160px; height: auto;}
header .inner .logo_top img { left: 50%; /*transform: translate(-50%,-50%);*/ }

.entry_btn { position: fixed; bottom: 20px; right: 25px; width: 140px; height: 140px; }
.entry_btn a{ width:140px; height: 140px; font-size:2.5rem; line-height: 1;}
.entry_btn a .s_txt{ font-size:1.4rem; letter-spacing: 0;}

#main_contents .main_copy {top: 19%;}
#main_contents .main_copy .jpn_copy{ font-size: 3.2rem; letter-spacing: 0.3rem; }
#main_contents .main_copy .eng_copy{ font-size: 1.8rem; letter-spacing: 0.1rem; margin-top:7px;  }

#main_contents section .wrapper{ max-width: none; padding: 0 30px; } 
#main_contents section h2 {font-size: 4.8rem; letter-spacing: 0.3rem;}
#main_contents section .jpn_ttl { font-size: 1.6rem; line-height: 1.3; letter-spacing: 0.3rem; margin-top: 20px; padding: 0 7px 0 13px;}
#main_contents section .jpn_ttl::after {border-top: 10px solid transparent; border-bottom: 10px solid transparent;}
#main_contents .cont_area {margin: 35px auto 0;}
.more_btn {width: 100%; height: 60px; margin: 50px auto 0;}
.more_btn a { width: 100%; height: 60px; font-size: 1.7rem; padding: 20px 10px 22px; border-radius: 10px;}

.wide_btn {
margin:60px auto 0; 
width :100%; 
max-width:920px; 
display: -ms-grid; 
display: grid; 
grid-gap: 30px 3.5%; 
-ms-grid-columns: 1fr; 
grid-template-columns: repeat(1, 1fr); 
-ms-grid-rows: auto 30px auto; 
grid-template-rows: repeat(2, auto);
}.wide_btn > *:nth-child(1) {
-ms-grid-row:1;
-ms-grid-column:1;
}.wide_btn > *:nth-child(2) {
-ms-grid-row:3;
-ms-grid-column:1;
}
.wide_btn a{ height: 170px; color: #fff; background: #006f9c; font-size: 2.4rem; padding: 71px 10px 77px; text-align: center; border-radius: 10px; }

#main_contents .cont_area .copy_area .main_txt { font-size: 4.2rem; line-height: 1.5; letter-spacing: 0.4rem; }
#main_contents .cont_area .copy_area .sub_txt{ font-size: 1.7rem; line-height: 1.9; margin-top: 25px;}

.chirashi_box { width: 100%; }

#main_contents #company .wrapper {
    /* padding: 0 40px; */
}

}


@media screen and (max-width:414px) {

footer .ft_inner .ft_menu nav.fnav ul li {margin-right: 0; display: block;}

#main_contents .main_img {padding: 0; min-height: auto; }
.main_img img { min-height: auto; }

#main_contents section .wrapper{ max-width: none; padding: 0 20px; } 
#main_contents section h2 {font-size: 4.2rem; letter-spacing: 0.2rem;}

#main_contents #about { padding: 90px 0 ; }

.movie_area { margin: 60px auto 0; }
.chirashi_box { margin: 60px auto 0; }
.chirashi_img { margin-top: 25px; }

#main_contents #company { padding: 90px 0; }
.company_box { padding: 40px 20px 40px; }
.company_ttl {
    font-size: 2.4rem;
    line-height: 1.4;
    letter-spacing: 0.2rem;
}
.company_box .sub_txt {margin-top: 25px; font-size: 1.8rem;}

#main_contents #entry { padding: 90px 20px 120px; }
#main_contents #entry .wrapper { padding: 60px 20px; }
#entry .policy_box { margin-top: 30px; }

.more_btn { margin: 30px auto 0; }


#main_contents .cont_area .copy_area .main_txt {font-size: 3.5rem;letter-spacing: 0.2rem; text-align: left;}
#main_contents #products .cont_area .txt_box .box_eng_ttl {font-size: 3.2rem;}
#main_contents_kaso #strength .cont_area .txt_area {width: 100%; padding: 30px 20px; }
#main_contents_kaso #strength .txt_area .point {/*display: block;*/ position: relative; top: 0; left: 0;}
#main_contents_kaso #strength .box_panel .point_txt {position: relative; bottom: 0; left: 0; font-size: 2.2rem; line-height: 1.7;}
#main_contents_kaso #strength .strength_box p.txt {margin-top: 20px; padding: 0;}

#main_contents #strength .cont_area .strength_box .box_num {width: 65px;}
#main_contents #bg_color::before {width: 280%;}

/* KASO ======================================================================================================================== */

#main_contents_kaso #main_img {height: 450px; }
#main_contents_kaso #main_img .ttl_area{ bottom: 20px; left:20px;}
#main_contents_kaso section .wrapper{ padding: 0 20px; } 
#main_contents_kaso #main_img .eng_ttl{ font-size: 4.2rem; letter-spacing: 0.3rem;}
#main_contents_kaso .under{ padding:50px 0 0 ; margin-top: 50px;}
#main_contents_kaso section h2{ font-size: 4.2rem; letter-spacing: 0.3rem;}
#main_contents_kaso section .copy_area .main_txt{ font-size: 2.2rem; margin-top:40px;}
.more_btn a {font-size: 1.6rem;}

}

@media screen and (max-width:321px) {

#main_contents .cont_area .copy_area .main_txt {font-size: 3.1rem;letter-spacing: 0.1rem;}
#main_contents section h2 {font-size: 3.8rem; letter-spacing: 0.1rem;}
#main_contents section .jpn_ttl {letter-spacing: 0.2rem;}
#main_contents_kaso #main_img {height: 420px; }
.works_fig .fig_img {width: 100%;}
.more_btn a {font-size: 1.5rem;}
}
