@charset "utf-8";
/* CSS Document */
/*===============================================
画面の横幅が667pxまでの設定
===============================================*/
@media screen and (max-width:667px){
/* ベースレイアウト */
.all_wrap{
	width:100%;
}
	
.container{
	width: 100%;
}

img{
	max-width: 100%;
	height: auto;
}
/*-------------------------------------------------------- 
                         ヘッダー
---------------------------------------------------------- */
header .head_cnt {
    min-width: 320px;
}
#header{
	width: 100%;
    height: 78px;
	margin: 0 auto;
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    background-color: #FFFFFF;
    z-index: 9999;
    box-shadow: 0 0 5px rgba(0,0,0,0.6);
}
.top_logo{
	margin:22px 64px 10px 10px;
}
#gnav{
	display:none;
}
    .sp_menu_btn {
        display: block;
        position: fixed;
        top: 21px;
        right: 16px;
        width: 34px;
        height: 31px;
    }
    .sp_menu_btn a {
        display: block;
        width: 34px;
        height: 31px;
        position: relative;
    }
    .sp_menu_btn a:before,
    .sp_menu_btn a:after {
        content: "";
        display: block;
        width: 34px;
        position: absolute;
    }
    .sp_menu_btn a:before {
        border-top:4px solid #30AC30;
        border-bottom:4px solid #30AC30;
        height: 31px;
    }
    .sp_menu_btn a:after {
        background-color: #30AC30;
        height: 4px;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: auto;
    }
    .sp_menu_btn span {
        display: none;
    }
    header nav {
        position: fixed;
        top: 78px;
        left: 0;
        width: 100%;
        height: 100vh;
        background-color: #FFFFFF;
    }
    header nav ul {
        display: block;
        border-top: 1px solid #CECECE;
    }
    header nav ul li {
        margin-right: 0;
        border-bottom: 1px dashed #CECECE;
    }
    header nav ul li a {
        display: block;
        padding: 10px 20px;
    }
    header nav ul li a:before {
        content: "";
        display: block;
        width: 8px;
        height: 8px;
        border-right: 1px solid #363636;
        border-bottom: 1px solid #363636;
        position: absolute;
        right: 14px;
        top: 0;
        bottom: 0;
        margin: auto;
        transform: rotate(-45deg);
    }
    header nav ul li a:after {
        display: none;
    }
    .for_tel {
        margin: 0;
        padding: 20px 10px;
        text-align: center;
        border-left: none;
        background-position: 40px 27px;
    }
    .for_tel a {
        color: inherit;
    }
    .close_btn {
        display: block;
        text-align: center;
    }
    .close_btn a {
        display: inline-block;
        border: 1px solid #000000;
        padding: 10px;
        width: 200px;
    }
/*-------------------------------------------------------- 
　　　　　　　　　　　　フッター
---------------------------------------------------------- */
footer {
    padding-top: 36px;
}
#footer_nav {
	display:block;
    margin: 0;
}
#footer_nav ul {
	 border-top: 1px solid #DDDDDD;
}
#footer_nav ul li {
	display:block;
 float: left;
 width: 50%;
    margin: 0;
 border-bottom: 1px solid #DDDDDD;
 border-right: 1px solid #DDDDDD;
}
#footer_nav ul li:last-child {
    border-bottom: none;
}
#footer_nav li:nth-child(even) { border-right: none;}
#footer_nav li a {
 position: relative;
 display:block;
 color: #000000;
 text-align: left;
 padding: 8px 8px 8px 16px;
}
.foot_ttl {
    font-size: 7vw;
}
.add{
    width: auto;
	text-align:left;
	margin:10px 0 18px 3%;
}
.add span{
	display:block;
}
.footer_rogo{
	width: auto;
	margin:16px 3% 26px;
}
.copyright {
    padding-right: 64px;
}
#main,
footer {
    min-width: 320px;
}
/*-------------------------------------------------------- 
　　　　　　　　　　　TOPページ
---------------------------------------------------------- */
/*
    #top_recruit{
	padding-bottom:46.86%;
	height:0;
	position:relative;
}

#top_recruit a{
	display:block;
	float:none;
	width:100%;
	height:100%;
	top:0;
	left:0;
	position:absolute;
	background:url(../images/smartphone/sp_bg_recruit.png) top left no-repeat;
	background-size:cover;
}
#top_recruit a:hover{
background:url(../images/smartphone/sp_bg_recruit.png) top left no-repeat;
background-size:cover;	
}
#top_recruit p{
	padding: 10% 0.56% 0 28%;
	color: #FFFFFF;
	font-size:3vw;
}
#top_recruit a:hover p{
	color:#255113;
}
#top_message{
	padding-bottom:46.86%;
	height:0;
	position:relative;
}
#top_message a{
	display:block;
	float:none;
	width:100%;
	height:100%;
	top:0;
	left:0;
	position:absolute;
	background:url(../images/smartphone/sp_bg_message.png) top left no-repeat;
	background-size:cover;
}
#top_message a.bg_re{
background:url(../images/smartphone/sp_bg_message.png) top left no-repeat;
background-size:cover;	
}
#top_service{
	padding-bottom:46.86%;
	height:0;
	position:relative;
}
#top_service a{
	display:block;
	width:100%;
	height:100%;
	top:0;
	left:0;
	position:absolute;
	background:url(../images/smartphone/sp_bg_service.png) top left no-repeat;
	background-size:cover;
}
#top_service a:hover{
background:url(../images/smartphone/sp_bg_service.png) top left no-repeat;	
}
#top_service p{
	display:none;
}

#top_about{
	padding-bottom:46.8%;
	height:0;
	position:relative;
}
#top_about a{
	display:block;
	float:none;
	width:100%;
	height:100%;
	top:0;
	left:0;
	position:absolute;
	background:url(../images/smartphone/sp_bg_about.png) top left no-repeat;
	background-size:cover;
}
#top_about a:hover{
background:url(../images/smartphone/sp_bg_about.png) top left no-repeat;	
}
#top_about p{
	padding: 14.4% 0.56% 0 36%;
	color:#FFFFFF;
	font-size:3vw;
}
#top_qa{
	padding-bottom:79%;
	height:0;
	position:relative;
}
#top_qa a{
	display:block;
	float:none;
	width:100%;
	height:100%;
	top:0;
	left:0;
	position:absolute;
	background:url(../images/smartphone/sp_bg_qa.png) top left no-repeat;
	background-size:cover;
}
#top_qa a:hover{
background:url(../images/smartphone/sp_bg_qa.png) top left no-repeat;	
}
#top_qa ul{
	padding: 25.3% 13% 0 16.5%;
	color:#265100;
	font-weight:bold;
	line-height:2;
}
#top_qa .txt_q{
	width:100%;
	float:none;
	margin-top:2.8%;
	line-height:1.4;
	font-size:3.5vw;
}
#top_qa a:hover .txt_q{
	color:#FFFFFF;
}
#top_qa .txt_a{
	float:right;
	width:100%;
	font-size:3vw;
	line-height:1.6;
	padding-top:25%;
}
*/
    #main_visual {
        height: auto;
        min-height: 0;
        margin-top: 78px;
        padding-top: 70%;
        background-size: 100% auto;
        background-position: top center;
        background-attachment: initial;
    }
    #main_visual_cnt {
        position: relative;
        width: 100%;
        height: auto;
        z-index: 1;
    }
    #main_visual h2,
    #main_visual p {
        width: auto;
        left: 10px;
    }
    #main_visual h2 {
        font-size: 8vw;
    }
    #main_visual h2 span {
        display: inline;
    }
    #main_visual p {
        font-size: 14px;
        line-height: 1.4;
    }
    #main_visual_img {
        position: absolute;
        width: 85vw;
        height: 76%;
    }
    #main_visual .main_visual_link {
        left: -32px;
        bottom: 267px;
    }
    #top_cnt01 {
        padding: 40px 10px 30px;
    }
    #top_cnt01 p {
        width: auto;
        display: block;
        text-align: left;
    }
    #top_cnt02 .cnt02_box .cnt_box {
        width: auto;
        padding: 10px;
    }
    #top_cnt01 .link_btn {
        margin: 20px 0 10px;
    }
    .link_btn a {
        width: auto;
        padding: 5px 30px;
    }
    #top_cnt04 {
        margin-bottom: 24px;
        padding: 20px 10px;
    }
    #top_cnt02 h2 {
        padding-top: 31%;
        font-size: 20vw;
        height: auto;
        line-height: 0.6;
        background-size: 100% auto;
        background-attachment: inherit;
    }
    #top_cnt02 h3 {
        padding: 20px 10px;
    }
    #top_cnt02 .cnt02_box .cnt_l,
    #top_cnt02 .cnt02_box .cnt_r {
        width: auto;
        height: auto;
        margin: 0 0 24px;
        background-color: transparent;
    }
    #top_cnt02 .cnt02_box.box03 .cnt_r {
        margin-bottom: 0;
    }
    #top_cnt02 .cnt02_box .cnt_l:after,
    #top_cnt02 .cnt02_box .cnt_r:after {
        top: auto;
        bottom: 0;
        left: 0;
        z-index: -1;
        height: 0;
        padding-bottom: 66.66%;
    }
    #top_cnt02 .cnt02_box.box01 .cnt_r:after,
    #top_cnt02 .cnt02_box.box02 .cnt_l:after {
        background-size: 100% auto;
    }
    #top_cnt02 .cnt02_box .cnt_l .cnt_box,
    #top_cnt02 .cnt02_box .cnt_r .cnt_box {
        background-color: #FFFFFF;
    }
    #top_qa {
        width: auto;
        margin: 0 10px 14px;
    }
    #top_qa h2 {
        font-size: 18vw;
        margin: 0;
    }
    #top_qa h2 span {
        font-size: 10vw;
    }
    #top_qa a {
        padding: 20px 10px;
    }
    #top_recruit {
        width: auto;
        margin-bottom: 60px;
    }
    #top_recruit h2 {
        font-size: 18vw;
        margin: 0;
    }
    #top_recruit a {
        margin: 0 10px;
        padding: 20px 10px;
        background-size: cover;
    }
    #top_cnt03 {
        padding: 20px 10px;
    }
    #top_cnt03 .tel {
        font-size: 10vw;
    }
    #top_cnt04 h2 {
        font-size: 8.5vw;
    }
    #top_cnt04 p {
        text-align: left;
    }
/*-------------------------------------------------------- 
　　　　　　　　　　　コンテンツ部分
---------------------------------------------------------- */
/*共通
--------------------*/
#h1_bg{
	padding:98px 0 16px;
	background-color:#EEEEEE;
}
h1{
	width:92.187%;
}
h1 img.sp_h1{
	display: block;
}
h1 img.pc_h1{
	display:none;
}
h2{
	margin: 18px 0 25px;
	font-size:20px;
}
h3{
	height:auto;
	min-height:48px;
	margin:25px auto 15px;
	line-height:1.5;
	font-size:16px;
}
.cnt_wrap{
	width:92.187%;
}
#pankuzu {
	width:92.187%;
}
/*-------------------------------------------------------- 
　　　　　　　　　　　会社案内 about
---------------------------------------------------------- */
#about #greeting {
	background-size:100% auto;
    background-position: top center;
	
}
#about #greeting .txt_area p img{
	display:block;
	text-align:center;
	margin:40px auto;
}
#about #greeting .txt_area {
	width:auto;
	margin: 0 auto;
    padding: 48% 10px 20px;
    min-height: 0;
}
#about #greeting .txt_cnt {
    padding: 10px;
    min-height: 0;
}
#about #outline img{
	float:none;
	width:100%;
	max-width:425px;
	margin:0 auto 20px;
}
#about #outline dl{
	float:none;
	width:100%;
}
#about #symbol img{
	float:none;
	max-width:245px;
	margin:0 0 40px;
}
#about #symbol p{
	text-align:center;
	width:100%;
}
#about #symbol .txt_area {
	float:none;
	width:100%;
	padding:5%;
}
#about #symbol .txt_area p{
	text-align: left;
}
#about #symbol h3{
	font-size:18px;
	text-align:center;
	margin:10px 0 0;
}
#about .map{
	width:90%;
}
#about .map iframe{
	width:100%;
}
/*-------------------------------------------------------- 
　　　　　　　　　　　事業案内
---------------------------------------------------------- */
    #service_photo .cnt_wrap {
        width: auto;
    }
#service_photo p.photo_read{
	margin-bottom:20px;
}
#service_photo li{
	float:none;
	margin:0 0 40px 0;
}
#pick_up .pick_img{
	float:none;
	max-width:100%;
	margin:0 auto 25px;
	text-align:center;
}
#pick_up .pick_txt{
	float:none;
	width:100%;
}
#pick_up .pick_txt h3{
	margin-bottom:0;
}
#facility .fl,#facility .fr{
	width:100%;
	float:none;
}
#facility .fl p,#facility .fr p{
	text-align:center;
}
#facility .fl p.facility_title,#facility .fr p.facility_title{
	text-align:left;
}
#customer ul{
	width:92.187%;
}
#customer li{
	float:none;
	width:100%;
	padding-left:22px;
	margin-right:0;
	margin-top:15px;
}
#customer li:nth-child(1),#customer li:nth-child(2),#customer li:nth-child(3){
	margin-top:15px;
}
#links ul{
	width:92.187%;
}
#links li{
	float:none;
	width:100%;
	margin-right:0;
	margin-top:15px;
}
#links li:nth-child(1),#links li:nth-child(2),#links li:nth-child(3){
	margin-top:15px;
}
ul#tp-grid {margin:0 auto!important; width:310px; min-width:310px!important;}
/*-------------------------------------------------------- 
　　　　　　　　　　　採用情報 recruit
---------------------------------------------------------- */
#recruit #greeting {
	background:none;
	
}
#recruit #greeting .txt_area p img{
	display:block;
	text-align:center;
	margin:40px auto;
}
#recruit #greeting .txt_area {
	width:92.187%;
	margin: 0 auto;
}
#recruit .recruit_link .fl,
#recruit .recruit_link .fr{
	width:100%;
	float:none;
	text-align:center;
}
#recruit .recruit_link .fr img{
	margin-top:40px;
}
#recruit dl dt {
	float: none;
	width:auto;
	padding: 0 0 0 20px;
	margin:17px 0 0 20px;
}
#recruit dl dd {
	float:none;
	width:auto;
	padding:0 0 0 20px;
	margin:0 0 15px 20px;
	border-left:none;
}
/*-------------------------------------------------------- 
　　　　　　　　　　　Q&A
---------------------------------------------------------- */
#qa .qa_link .fl,#qa .qa_link .fr{
	width:100%;
	float:none;
	text-align:center;
}
#qa .qa_link .fr p{
	margin-top:40px;
}
.btm_contact_wrap{
	width:92.187%;
	height:auto;
	margin:0 auto;
	background:none;
}
.btm_contact p{
	width:100%;
	text-align:center;
}

/*-------------------------------------------------------- 
　　　　　　　　　　　メッセージ massage
---------------------------------------------------------- */
#massage .massage_link .fl,#massage .massage_link .fr{
	width:48%;
}
#massage .massage_link .fl img,#massage .massage_link .fr img{
	width:100%;
}
#massage .massage_link .name_area{
	font-size:13px;
}
#massage p.massage_years{
	float:none;
	width:100%;
}
#massage p.massage_name{
	float:none;
	text-align:left;
	padding-left:22px;
	width:100%;
}
#massage .img_left .cnt_wrap,#massage .img_right .cnt_wrap{
	width:92.187%;
	padding-bottom:30px;
}
.sp_img{
	display:block;
}
.pc_img{
	display:none;
}
#massage .img_left .cnt_wrap .txt_area{
	margin-right:3.5%;
	width:60%;
}


#massage .img_right .cnt_wrap .txt_area{
	margin-left:3.5%;
	width:60%;
}
#massage .cnt_wrap img{
	width:35%;
	height:100%;
}
#massage h2{
	padding:30px 0 10px;
	line-height:1.5;
}
    #service_re #pankuzu {
        margin: 10px 10px 17px;
    }
    #service_re .cnt_wrap {
        width: auto;
    }
    #service_re h1 {
        margin-top: 78px;
        padding: 36px 10px;
        font-size: 21vw;
    }
#service_re h2 + p,
#service_re #service_area p,
#service_re #customer h2 + p {
    text-align: left;
}
    #service_re #service_area p,
    #service_re h2 + p {
        margin: 0 10px 48px;
        line-height: 1.8;
    }
    #service_re h3 {
        margin: 0 10px 36px;
    }
    #service_re .cnt_wrap.service01 p:last-child,
    #service_re .cnt_wrap.service02 p:last-child,
    #service_re .cnt_wrap.service03 p:last-child {
        padding: 18px 10px 180px;
        min-height: 0;
    }
    #service_re .cnt_wrap.service01,
    #service_re .cnt_wrap.service02,
    #service_re .cnt_wrap.service03 {
        margin: 0 0 24px;
    }
    #service_re #facility ul {
        flex-wrap: wrap;
    }
    #service_re #facility ul li {
        width: 48%;
        margin: 0 0 16px;
    }
    #pankuzu {
        width: auto;
    }
    #service_re h2 {
        margin: 0 10px;
    }
    #service_re .cnt_wrap.service01:after,
    #service_re .cnt_wrap.service02:after,
    #service_re .cnt_wrap.service03:after {
        display: none;
    }
    #service_re #facility,
    #service_re #customer {
        padding: 20px 10px;
    }
    #service_re #customer h2 {
        margin: 14px 0 12px;
    }
    #service_re #customer ul {
        width: auto;
        margin: 0 0 14px 12px;
    }
    #service_re #customer li {
        margin-top: 6px;
    }
    #service_re #customer .cnt_wrap p:last-child {
        margin: 20px 0;
    }
    #otoiawase {
        padding: 20px 10px;
    }
    #otoiawase .tel {
        font-size: 10vw;
    }
}
@media screen and (max-width:320px){
	#top_qa .txt_a{
	font-size:2.5vw;	
}
#footer_link li {display:block; margin-bottom:5px;}

}