/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */
body {
	background-color: transparent;
	background-image:none;
}
.br_pconly {display:none;}
.br_sponly {display:block;}

/* -----------------------------------------------
ヘッダー・グローバルナビ部分
----------------------------------------------- */
    #top-head,
    .inner {
        width: 100%;
        padding: 0;
		height:90px;
    }
    #top-head {
        top: 0;
        position: fixed;
        margin-top: 0;
		text-align:left;
    }
    /* Fixed reset */
    #top-head.fixed {
        padding-top: 0;
        background: transparent;
    }
    #mobile-head {
        background: #fff;
        width: 100%;
        height: 70px;
        z-index: 999;
        position: relative;
    }
    #top-head.fixed .logo,
    #top-head .logo {
        position: absolute;
		margin: 0;
        left: 13px;
        top: 10px;
	}
    #top-head.fixed .logo img,
    #top-head .logo img{
	width:70%; height:auto;
    }
#top-head .head_text {display: none;}

    #global-nav {
        position: absolute;
        /* 開いてないときは画面外に配置 */
        top: -508px;
		right:0;
        width: 100%;
        padding: 20px 0 0;
        -webkit-transition: .5s ease-in-out;
        -moz-transition: .5s ease-in-out;
        transition: .5s ease-in-out;
    }
    #global-nav ul {
        list-style: none;
        position: static;
        font-size: 18px;
		text-align:left;
		margin:0;
		padding:0;
		line-height:20px;
		width:100%;
		
    }
    #global-nav ul li {
	box-sizing: border-box;
	display:block;
	padding:0;
	margin:0 auto 0;
	border-bottom:solid 1px #ccc;
	background:#F7F6F4;
    }
    #global-nav ul li:last-child {
		border-bottom:none;
    }

    #top-head #global-nav ul li a,
    #top-head.fixed #global-nav ul li a {
	box-sizing: border-box;
        display: block;
		padding:1em;
		font-size:88%;
		margin: 0;
    }
    #nav-toggle {
        display: block;
    }

#global-nav ul li a:link {text-decoration: none;}
#global-nav ul li a:visited { text-decoration: none;}
#global-nav ul li a:hover { background:#004097; color: #fff; text-decoration: none; }
#global-nav ul li a:active { background:#004097; color: #fff; text-decoration: none;}

    /* #nav-toggle 切り替えアニメーション */
    .open #nav-toggle span:nth-child(1) {
        top: 11px;
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        transform: rotate(45deg);
    }
    .open #nav-toggle span:nth-child(2) {
        width: 0;
        left: 50%;
    }
    .open #nav-toggle span:nth-child(3) {
        top: 11px;
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }
    /* #global-nav スライドアニメーション */
    .open #global-nav {
        /* #global-nav top + #mobile-head height */
        -moz-transform: translateY(556px);
        -webkit-transform: translateY(556px);
        transform: translateY(556px);
    }
header { margin:70px 0 0;}
header .slide_sp {
    height: 50vh;
    width: 100%;
    background-position: center;
    background-repeat: no-repeat;
	background-image: url(../images/header_back_sp.jpg);
    background-size: cover;
    display:block;
}
header .main_copy {
	width: 80vw;
	height: 40vh;
	display: flex;
	justify-content: center;
	align-items: center;
	box-sizing: border-box;
	max-width: 440px;
	margin: 0 auto;
	text-align: center;
}

header .spimg {
	width:100%;
	height:100%;
	max-width: 440px;
	display:block;
}
header .slide {display:none;}
header .pcimg {display:none;}

 /* 共通 */

#TOP_news,#TOP_shop,#TOP_company,#TOP_recruit {width:auto;line-height: 1.6;}
.TOP_news,.TOP_shop,.TOP_company,.TOP_recruit {padding:40px 20px;}
 .go_detail {width:85%;}

 /* 共通end */
  /* -----------------------------------------------
TOP_shop
----------------------------------------------- */
#TOP_news {padding:0 0}
.TOP_news h1 {margin:0 0 1em 0;}
.TOP_news ul li { width:100%; display:block; padding:0;}
.TOP_news ul li:last-child { display:block; width:100%;}
.TOP_news dl{width: 100%; margin:0; text-align:left; font-size:14px;}
.TOP_news dt{
	display: block;
	width: 100%;
	float: none;
	margin:0 0 1em 0;
}
.TOP_news dd{
	width: 100%;
	float: none;
}

 /* -----------------------------------------------
TOP_shop
----------------------------------------------- */
.TOP_shop ul li {
	display:block;
	width:100%;
	margin:0 auto 80px;
	text-align: center;
	max-width: 300px;
}
.TOP_shop ul li:last-child {
	margin:0 auto 80px;
}

.TOP_shop  li .catch {
	text-align: left;
}
.TOP_shop li .shop_text {
	text-align: left;
}

.shop_zone .go_detail {
	max-width:110px;
	font-size:10px;
	line-height:30px;
}
.shop_zone .go_detail a {
	background-position:92% 10px;
	background-size:5%;
}

.TOP_shop .phbox_left,
.TOP_shop .phbox_right {
	width:100%;
}
.TOP_shop .phbox_left,
.TOP_shop .phbox_right
 {float:none; margin:0 0 20px 0;}
.TOP_shop .phbox img {width:100%; max-width:500px;}

 /* -----------------------------------------------
TOP_recruit
----------------------------------------------- */
#TOP_recruit {
	margin: 0 auto 0;
	padding: 20px 0 0;
}
.TOP_recruit .go_recruit {
	width:100%;
}

footer { font-size:87.5%; line-height:1.6;}
footer .f_inner{width: 100%;padding:20px 0 0;}
footer .f_inner_left,
footer .f_inner_right{
	display:block;
}
footer .f_inner_left{
	width: 100%;
}
footer .f_inner_right{
	width: 100%;
	max-width: 768px;
	border-left: none;
	margin-top: 20px;
	
}
footer .f_inner_right img {border-top: solid 1px #000;padding-top: 20px;}
footer .copyright{
	font-size:87.5%;
	margin: 20px 0;
}


 /* 各ページ共通 */
#shop_page,#company_page,#kodawari_page {max-width:768px; margin: 40px auto 0;padding: 40px 0 0; box-sizing: border-box;}
/* 各ページ共通 */

/* -----------------------------------------------
shop_page
----------------------------------------------- */
.shop_head{
	padding: 40px 20px 250px;
	margin: 0 auto;
	background-image: url(../images/shop_head_sp.jpg);
	height: auto;
	background-size: cover;
	overflow: hidden;
}
.shop_head .shop_menu{
	width: 100%;
	padding:0;
}
.shop_menu h1{
	font-size: 48px;
	float: left;
	width: 40%;
}
.shop_menu ul{
	float: right;
	width: 60%;
}
.shop_page {
	padding: 0 20px 0;
	border-top: solid 1px #CCCCCC;
}
.shop_page h1 {
	font-size:28px;
	font-weight: bold;
	line-height: 1.4;
}

.shop_page .shop_logo {
	width:100%;
	float: none;
	padding:0 0 0 0;
}
.shop_page .shop_concept {
	width:100%;
	padding:0 0 20px 0;
}
.shop_concept .concept_title {font-size: 20px;}
.shop_detailbox{padding: 40px 20px;margin: 0 auto 20px;}
.shop_detailbox .shop_detail_left{
	float: none;
	width: 100%;
	padding-right: 0;
	margin-top:20px;
}
.shop_detailbox .shop_detail_right {
	width:100%;
	max-width:500px;
	margin:20px auto 0;
	float: none;
}
.shop_detail_right li {
	float:none;
	width:100%;
	margin-right: 0;
	margin-bottom: 2%;
}

/* -----------------------------------------------
company_page
----------------------------------------------- */
.company_head{
	padding: 40px 20px 250px;
	margin: 0 auto;
	background-image: url(../images/company_head_sp.jpg);
	height: auto;
	background-size: cover;
	overflow: hidden;
}
.company_head .company_menu{
	width: 100%;
	padding:0;
}
.company_menu h1{
	font-size: 48px;
	float: left;
	width: 40%;
}
.company_menu ul{
	float: right;
	width: 55%;
	padding: 30% 0 0;
}
.company_page {
	padding: 0 20px 0;
	border-top: solid 1px #CCCCCC;
}
.company_page h1 {
	font-size:28px;
	font-weight: bold;
	line-height: 1.4;
}
.company_page .greeting_title {font-size: 20px;}
.company_page .greeting_ph {
	width:100%;
	float: none;
	padding:20px 0;
}
.company_page .greeting_ph img {width: 100%;}
.company_page .greeting {
	width:100%;
	max-width:768px;
	padding:0 0 20px;
	float: none;
}
.greeting .g_name {font-size: 24px; }
#company_page .about_box{
	margin: 0 auto 40px;
}
.about_box h2{
	font-size: 24px;
	padding: .2em 0;
}
.about_box .about_box_innner{
	padding: 20px;
}
.about_box_innner .about_box_left{
	display: block;
	width: 100%;
}
.about_box_innner .about_box_right{
	width: 100%;
	display: block;
	margin-top: 20px;
}
.about_box .about_box_innner2{
	padding: 20px;
}
.about_box .about_box_innner2 p{
	margin: 0 0 20px;
}
.about_box_innner2 .kizuna{
	font-size: 115%;
}
.company_page .overview_box,.company_page{
	margin:0 auto 40px;
}
.company_page .overview_box_left,.company_page .history_box_left{
	width:100%;
	display: block;
}
.company_page .overview_box_left .overview,
.company_page .history_box_left .history{font-size: 16px;font-weight: bold;margin:0 0 1em;}
.company_page .overview_title,.company_page .history_title {font-size: 24px;font-weight: bold;margin:0 0 1em;display: block;position: relative;}
.company_page .overview_box_right{
	width:100%;
	display: block;
	margin: 0 0 0 0;
}
.map_container {
	margin: 0 auto 10px;
	padding: 10px;
}
.map {
	margin: 0 auto;
}
.company_page .history_box{margin-top: 40px;}
.company_page .history_box_right{
	width:100%;
	display: block;
}
.history_box_right dl{font-size: 94%;}

.history_box_right dt{
width: 30%;
}
.history_box_right dd{
width: 70%;
}
/* -----------------------------------------------
recruit_page
----------------------------------------------- */
.recruit_head{
	padding: 40px 20px 250px;
	margin: 0 auto;
	background-image: url(../images/recruit_head_sp.jpg);
	height: auto;
	background-size: cover;
	overflow: hidden;
}
.recruit_head .recruit_menu{
	width: 100%;
	padding:0;
}
.recruit_menu h1{
	font-size: 48px;
	float: left;
	width: 40%;
}
.recruit_menu ul{
	float: right;
	width: 80%;
	padding: 5% 0 0;
}
.recruit_page {
	padding: 0 20px 0;
	border-top: solid 1px #CCCCCC;
}
.recruit_page h1 {
	font-size:26px;
	font-weight: bold;
	line-height: 1.4;
}
.recruit_page .greeting_title {font-size: 20px;}
.recruit_page .recruit_ph,.recruit_ph2 {
	width:100%;
	padding:20px 0;
}
.recruit_page .recruit_ph{float: none;}
.recruit_page .recruit_ph img{width: 100%;}
.recruit_page .recruit_ph2 {float: none;margin-right: 0;}
.recruit_page .recruit_ph2 img {width: 100%;}

.recruit_page .greeting {
	width:100%;
	padding:20px 0;
	float: none;
}
#recruit_page .about_box{
	padding: 20px;
	margin: 0 auto 40px;
}
#recruit_page .about_box .recruitmenu li{
	display: block;
	width: 100%;
	margin-right: 0%;
	margin-bottom: 2%;
}
#recruit_page .about_box .recruitmenu li img{width: 100%;}
#recruit_page .go_rec_detail {
	width: 80%;
	margin: 10px auto 20px;
}
.recruit_page .interview_box {
	padding:0 0 20px;
	margin:0 auto 40px;
}
.interview_box::after {
    left: 28%;
    width: 50%;
}
.recruit_page .interview_box_last {
	padding:0 0 20px;
	margin:0 auto 20px;
}
.recruit_page .interview_box_left,
.recruit_page .interview_box_right {
	text-align: center;
	position: static;
}
.recruit_page .interview_box_left img,
.recruit_page .interview_box_right img {width: 100%}

.recruit_page .interview_box_left .profilebox,
.recruit_page .interview_box_right .profilebox{
	position: relative;
	padding: 4% 8% 2%;
}
.profilebox .inter_no{padding:0 0;}
.profilebox .inter_name{font-size: 24px;}
.recruit_page .inter_title {font-size: 24px;margin:1em 0;}
.inter_title::after {
    left: 34%;
}
.career_box::after {
    left: 28%;
    width: 50%;
}
.recruit_page .career_box img {height: auto; width: 100%;}
.recruit_page .career_box2 {	margin:0 auto 20px;}
.recruit_page .career_box3 {	margin:0 auto 20px;}
.career_box3 .career_box3_innner{	padding: 20px 0;}
.career_box3 .career_box3_innner p{	margin: 0 0 20px;padding: 0 20px;}
.requirements_page {
	margin: 20px auto 0;
	border-top: solid 1px #CCCCCC;
}

.requirements_page h1 {
	margin:0 0 1em 0;
	font-size:26px;
}
.requirements_table {
	margin:20px 0;    
}
.requirements_table td.midashi {
	width:25%;
}
.requirements_table td.naiyou {
	width:75%;
}
.contact_head h1{
	font-size: 32px;
	font-weight: bold;
	position: relative;
    display: inline-block;
}
/* -----------------------------------------------
news_page
----------------------------------------------- */
.news_head{
	padding: 40px 20px 100px;
	margin: 0 auto;
	background-image: none;
	height: auto;
	overflow: hidden;
	background-color: #EFF8FE;

}
.news_head .news_menu{
	width: 100%;
	padding:0;
}
.news_menu h1{
	font-size: 48px;
	float: left;
	width: 40%;
}
.news_menu ul{
	float: right;
	width: 80%;
	padding: 5% 0 0;
}
.news_page {
	padding: 0 20px 0;
	border-top: solid 1px #CCCCCC;
}
.news_page h1 {
	font-size:26px;
	font-weight: bold;
	line-height: 1.4;
}
.news_page img {width: 100%;height:auto;}