@charset "utf-8";

@-ms-viewport {
  width: device-width;
}

@viewport {
  width: device-width;
}


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

* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
	
.pc{display:none!important;}
.sp{display:block!important;}	


/*common
----------------------------------------------------*/
html{
	scroll-padding-top: 80px;
}

body {
	font-size:3.4vw;
}

.contents{
	width:90%;
	padding:12vw 0;
}


/*header
----------------------------------------------------*/
header{
	height:80vw;
	margin-top:46px;
}

header.mid{
	height:32vh;
}

header .header{
	height:80px;
	padding:10px 0;
}

header h1 a{
	width:30vw;
	height: 30vw;
	border-radius: 15vw;
}

header h1 img{
	width: 20vw;
	padding: 4.0vw 0 0 0;
}

header h1 span{
	padding: 0 6vw;
	background: url("../img/bg_ttl.png") no-repeat center center / contain;
	font-size: 3.4vw;
}

header h2 img{
	width: 60%;
}

header.fixed h2 a {
  width: 100px!important;
}

header .header h2{
	height: 50px;
	margin: 3px 0 0 10px;
    text-align: left;
}


/*sp button
-------------------------------------------------*/
#triggerBox{
    top: 18px;
    right: 10px;
}

header.fixed #triggerBox{
	top:18px;
}

/*navigation
-------------------------------------------------*/
#headIn{
	overflow: auto;
	position: fixed;
	height:100%;
	left: 0px;
	top: 0px;
	right: 0px;
    background: rgba(255,255,255,.85);
	background-size:100% 100%;
    -webkit-overflow-scrolling: touch;
    z-index: 10000;
}

header #headIn nav ul{
	position:absolute;
	top:0;
	bottom:0;
	margin:auto;
	height:65vh;
}

header #headIn nav ul li a{
    font-size: 5.4vw;
}

#headIn nav ul li a span{
	font-size:2.8vw;
}


/*navigation PC
-------------------------------------------------*/
.nav_pc{
	display: none;
}


/*common
----------------------------------------------------*/
h2{
	margin-bottom:6vw;
	font-size:5vw;
}

h2 span{
	font-size:4vw;
}

.ph_left,
.ph_right{
	display: block;
}

.ph_left .contents,
.ph_right .contents{
	width: 90%;
	padding: 8vw 0 0 0!important;
}

.ph_left .ph{
	width: 100%;
	height: 60vw;
	background: url("../img/bg_ph_left.jpg") no-repeat left center / cover;	
}

.ph_right .ph{
	width: 100%;
	height: 60vw;
	background: url("../img/bg_ph_left.jpg") no-repeat right center / cover;
}


/*sec01
----------------------------------------------------*/
.sec01 .contents dl{
	margin-bottom: 16vw;
	padding: 6vw 6vw 4vw 6vw;
	border-radius: 2vw;
	display: block;
}

.sec01 .contents dl dt{
	width: 100%;
	margin-bottom: 8vw;
}

.sec01 .contents dl dd{
	width: 100%;
}

.sec01 .contents dl dd .num{
	top: -3vw;
	font-size: 18vw;
}

.sec01 .contents dl dd h2{
	margin-left: 26vw;
	font-size: 6vw;
}

.sec01 .contents dl dd img{
	width: 30vw;
	height: auto;
	margin: 6vw auto;
}

.sec01 .contents dl dd dl{
	grid-gap: 0 4vw;	
}

.btn{
	width: 80%;
	margin: 0 auto;
	padding: 3vw 4vw;
	background: url("../img/icon_link.png") no-repeat right 3vw center / 2em;
}

.sec01 .contents dl dd .btn{
	margin: 0 auto;	
}


/*sec03
----------------------------------------------------*/
.sec03 .contents{
    width: 90%;
}

.sec03 .contents th{
	width: 7em;
	padding-right: 1em;
}

#map{
	height:100vw;
}


/*sec04
----------------------------------------------------*/
.sec04 .contents h2{
    margin-bottom: 10vw;
}

.box_recruit{
    margin-bottom: 10vw;
    display: block;
}

.box_recruit img{
	margin-bottom: 10vw;
}

.box_recruit .btn{
    width: 80%;
	margin: 2em auto 0 auto;
    display: block;
}

/*sec05
----------------------------------------------------*/
.sec05 .contents{
    width: 90%;
}

.sec05 .contents dl {
	grid-gap: 0 4vw;
}

.btn_map{
	margin-left: 0;
	display: inline-block;
}

.sec05 .kakomi{
	margin-bottom: 6vw;
	padding: 6vw;
}

.bg_gray{
	padding: 6vw;
}

.box_sns ul{
	width: 80%;
	display: block;
}

.box_sns ul li{
	margin-bottom: 6vw;
}


/*sec06（コンタクト）
----------------------------------------------------*/
.sec06 table{
	width:100%;
}

.sec06 table th,
.sec06 table td{
	width:100%;
	display:block;
}

.sec06 input[type="submit"]{
	font-size:4.4vw;
}

.sec06 .kakomi{
	height:25em;
	padding:4vw;
	font-size:2.8vw;
}

.sec06 .kakomi h3{
    font-size: 4vw;
}

.sec06 .kakomi p{
	font-size: 3.4vw;
}


/*sec07
----------------------------------------------------*/
.sec07{
	padding: 12em 0;
	background: url("../img/bg_company.jpg") no-repeat center / cover;
	text-align: center;
	color: #FFF;
}

.sec07 h2{
	margin-bottom: 0.5em;
	font-size: 2.5em;
}

.sec07 .btn{
	border: 1px solid #FFF;
	background: url("../img/icon_link_w.png") no-repeat right 15px center / 1em;
	color: #FFF;
}

@media(any-hover:hover){
.sec07 .btn:hover{
	background: #FFF url("../img/icon_link.png") no-repeat right 15px center / 1em;
	color: #000;
	opacity: 1;
}
}


/*下層
----------------------------------------------------*/
#company h2{
	margin-bottom: 1em;
}

.recruit{
	margin: 3em auto;
	padding: 6vw;
	border-radius: 2vw;
}

.recruit h2{
	font-size: 5vw!important;
}

.recruit .mv{
	width: calc(100% + 12vw);
	margin: -6vw auto 2em -6vw;
}

.sec05 .recruit dl{
	grid-gap: 0 6vw;
}


/*footer
----------------------------------------------------*/
footer h2 img{
	width: 20vw;
	margin: 0 auto 2vw auto;
}

footer h2 a{
	font-size: 3.4vw;
}

footer h2 a span{
	font-size: 4.4vw;
}

footer .copyright{
	font-size: 2.8vw;
}


/*page top
----------------------------------------------------*/
#page-top a{
	width:8vw;
	height:8vw;
}

}