@charset "utf-8";
/* CSS Document */

body { font-size:14px; }

/********** header *******************/

/***************  全体  *******************/
.pc{
	display:none;
}

.sp {
	display: block;
}




#header{
	background-size: 15%;
}

header#header nav {
	position:relative;
    display: block;
    padding-top: 0;
    width: 100%;
	top:12em;
}

/*
#header nav.pc_nav{
	display:none;
}
*/

#header nav.pc_nav{
	height:0em;
	z-index:300;
}

header#header #spnav {
	display:block;
	font-size:2.5em;
	position:absolute;
	top:0.5em;
	right:0.5em;
}

header#header p.sp_logo{
	display:block;
	margin: 0;
	width: 6em;
	margin: auto;
	position: relative;
	top: 1em;
	z-index: 200;
	height: 7.5em;
}

header#header p.sp_logo a{
	display:block;
}

header#header p.sp_logo a img{
	width:100%;
}


header#header #spnav a {
	color:#331900;
}

header#header nav ul#nav {
	position:absolute; 
	top: -64px;
	/*left: 0%;*/
	z-index: 100;
	width: 100%;
	margin: 0 0 1px 0;
	padding: 0;
	display: none;
	border: solid 1px #EEECE5;
}

ul.navbar_nav li a:before {
    
    display: none;
 
}

header#header nav ul#nav li {
	display:block; margin:0 0 0 0;
	width:100%; 
	background-color: rgba(255,255,255,0.95);
    padding-left: 0;
    border-bottom: 1px dotted #222;
	
}
header#header nav ul#nav li:last-of-type {
	border-bottom: none;	
}

header#header nav ul#nav li a {
	display:block;
	padding:0.6em 1em; color:#222;
}

#header nav.pc_nav ul li{
	padding:0;
}

ul.navbar_nav li.n2 a,
ul.navbar_nav li.n5 a,
ul.navbar_nav li.n6 a{
	left:0;
}

#header nav.pc_nav ul li a img{
	display: none;
}

ul.navbar_nav li+li:before {
	display:none;
}

header#header nav ul#nav li.n4 {
    display: none;
}





header#header #trans {
	float:none; margin:0 0 10px;
}

section#slide img.top_logo {
    position: absolute;
    max-width: 167px;
    bottom: 1em;
    right: 2em;
}


div.common h2.top_ttl{
	font-size: 1.7em;
}

/*********** 見出し *****************************/
/*
main .ttl {
	margin-top:30px;
}
*/


/******** layout *******************/

section#top_about,
.inner,
.middle_inner,
.lower_inner {
	width:96%; padding-left:2%; padding-right:2%;
}


br.pc {
	display:none;
}

section#top_about p.f20 {
	text-align:left;

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


/*************** coming_soon start ***************************/
section#coming_soon div.coming_bg h2 {
	font-size: 2.3em;
}
section#coming_soon div.coming_bg img {
	max-width:442px; width:80%; height:auto;
	display:block;
	
}

/*************** coming_soon end ***************************/



/*****************************  top_topics  ****************************************/


section#top_topics dl, section#top_topics dt, section#topics dl#tp, section#topics dl.tp {
	display: block;
}

section#top_topics dl.tp dd, section#top_topics dd, section#topics dl.tp dd,
section#top_topics dl#tp dd, section#top_topics dd, section#topics dl#tp dd {
	padding-left: 0;
}

section#top_topics h4.green_ttl {
	margin-bottom:2em;
}

/*****************************  staff  ****************************************/

section#staff div.common{
	background-position: 75% 65%;
	background-size: 416%;
	background-position: 65% 100%;
}
/*
div.common h2.top_ttl span{
	text-shadow: 1px 4px 3px #000;
}*/

section#staff div.inner{
	padding-bottom: 0em;
	margin-bottom: 3em;
}

section#staff figure{
	float: none;
	width: 90%;
	margin: auto;
}

section#staff figure.e{
	margin:auto;
}

section#staff figure img {
    width: 100%;
    max-width: 311px;
}

section#staff figcaption img{
	top: -20px;
	left: -2px;
}

section#staff figcaption{
	margin-bottom: 3em;
}

section#staff figcaption p.name{
	font-size:1.3em;
}

section#staff figcaption img.tmt01 {
    top: -12px;
}

section#staff figcaption img.kyuuri {
    top: -16px;
    left: -2px;
}

section#staff figcaption img.tmt02 {
    top: -6px;
    left: -2px;
}





/*******************************  to_top  **************************************/

section#to_top div.inner{
	background-position: -2% bottom,-200% 111%,300% 111%;
	padding-bottom: 6em;
	background-size: 150%,0%,0%;
}



/*****************************  recruit  ***********************************/
section#recruit div.common{
	background-position: 24% 100%;	
	background-size: 320%;
}

section#recruit h4.green_ttl{
	padding-top: 3em;
}

section#recruit div.lower_inner{
	display:block;
}

section#recruit div.lower_inner img{
	width:100%;
	padding-top:1.5em;
}

section#recruit div.flex img.left, 
section#recruit div.flex div.message_txt{
	width:100%;	
}

section#recruit div.flex div.message_txt{
	padding-bottom: 1.5em;
}

section#recruit p.heading{
	margin-bottom: 1em;
	margin-top: 1.5em;
	font-size: 1.2em;
}

section#recruit p.heading br{
	display:none;
}

section#recruit p.text{
	font-size:1em;
}

section#recruit p.text br{
	display:none;
}

section#recruit p.name{
	font-size:1.1em;
	margin-top:1em;
}

h4.green_ttl{
	margin-bottom: 1em;
}

section#message{
	padding-bottom: 1em;
}

section#recruitment table th{
	width: 6em;
	padding-left: 1em;
}

h5.contact_form {
    font-size: 1.2em;
    margin-top: 2em;
    margin-bottom: 1.5em;
    letter-spacing: 1px;
}

div.form_box {
    width: 100%;
	text-align: center;
}

section#recruitment{
	padding-bottom: 1em;
}

h4.green_ttl{
	font-size: 1.6em;
	padding-top: 2em;
	margin-bottom: 2.5em;
}

section#recruit div.flex div.message_txt div.box_inner{
	margin: 0 1em;
}

p.tel_btn, p.mail_btn{
	float:none;
	margin: 3em 0;
}

p.tel_btn a{
	font-size: 1.2em;
}

p.mail_btn a{
	font-size: 1.2em;
	padding: 0.84em 2.3em;
	border-radius: 9px;
}


/***************************  goods  ******************************/
h4.green_ttl{
	margin-bottom: 1em;
}

section#goods div.common{
	background-size: 321%;
}

section#goods img.img01 {
    width: 95%;
	padding-top: 1.5em;
}

section#goods div.image_box{
	padding-bottom: 3em;
}

section#goods div.image_box {
    margin-top: 2em;
}

section#goods div.pochi{
	padding-top: 4em;
}



/**************20190813 start************/

section#contact_frame dl {
    background-position: center top;
    width: 95%;
	height: auto;
}
/*section#contact_frame dl dt {
    padding-top: 3.7em;
	font-size: 1.4em;
	width: 77%;
    margin: 0 auto;
}
*/
section#contact_frame dl dt {
    padding-top: 4.2em;
    font-size: 1em;
    width: 77%;
    margin: 0 auto;
}
section#contact_frame dl dd.txt {
    padding-top: 0.2em;
    padding-bottom: 0.8em;
    width: 80%;
    margin: 0 auto;
	text-align:left;
}
section#contact_frame dl dd.txt br {
	display:none;
}
section#contact_frame p.mail_btn {
	margin: 0em 0;
}
section#contact_frame p.mail_btn a {
    font-size: 1em;
    padding: 0.7em 2.35em;
}
section#goods dd.frame_contact:before {
	display:none;
}
/**************20190813 end************/

section#contact_frame dl dd.txt {
     padding-top: 0.2em;
     padding-bottom: 0.8em;
     width: 70%;
     margin: 0 auto;
     text-align: left;
}






div.sign{
	width: 100%;
	margin:0;
	left:0;
}

div.sign p.mail_btn{
	top: 41%;
	right: 12%;
}

div.sign p.mail_btn a{
	font-size:1em;
	padding: 0.6em 2em;
}

section#article {
    padding-bottom: 1em;
}

section#goods section#commitment{
	margin-top: 0em;
	padding-bottom: 2em;
}

section#commitment p.vertical{
	font-size:1.5em;
}

section#commitment div.vertical {
    width: 11em;
	padding-top: 2em;
	padding-bottom: 0em;
}

_:-ms-lang(x), _::-webkit-meter-bar,section#commitment div.vertical {
	width:7em;
}

section#commitment div.flex {
    margin-top: 2em;
	display:block;
}

section#commitment div.flex img{
	width:100%;
	padding-top: 1em;
}

section#commitment p.commit_txt01 {
    font-size: 1.2em;
}

section#commitment p.commit_txt02{
	text-align:left;
	margin: 1em 0;
	font-size:1em;
}

section#commitment p.commit_txt02 br{
	display:none;
}

section#commitment {
    padding-bottom: 2em;
    margin-bottom: 2em;
}

section#goods figure:nth-of-type(2n+1) {
    clear: both;
}

section#goods figure {
    width: 47%;
    margin: 1.5%;
}

section#goods figure.e {
    margin: 1.5%;
}



/*********************************  contact  ****************************************/

section#contact div.common {
    background-image: url(../img/contact/top_bg.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 345%;
}



/**********************************  footer  ************************************************/
#footer{
    background-size: 15%;
	padding-bottom: 1em;
}

p.copy_pc{
	display:none;
}

p.copy_sp {
    display: block;
}

#footer nav{
	float: none;
}

#footer nav.right ul li.weight{
	margin-left: 0.5em;
	display: block;
}

#footer h6.akane{
	margin-bottom: 0em;
}

/***************************  about_us  ***********************************/
section#about_us div.common{
	background-size: 318%;
}

section#about_us section#commitment {
    padding-bottom: 1.5em;
}

section#about_us section#commitment .lower_inner {
    width: calc(100% - 4%);
	margin-top: 3em;
}


section#commitment p.commit_txt01{
	margin-top: 1.5em;
}

section#about_us section#commitment dl dd img.all{
	display: block;
	width: 100%;
}

section#about_us section#commitment dl dd div.right_box{
	display: block;
	width: 100%;
	margin:4em auto 0 auto;
}
/*
section#about_us section#commitment dl dd div.right_box img.crow{
	top: -40px;	
}*/

@media (min-width: 695px) and (max-width: 767px) {
section#about_us section#commitment dl dd div.right_box img.crow{
	top: -81px;	
}

}

@media (min-width: 600px) and (max-width: 694px) {
section#about_us section#commitment dl dd div.right_box img.crow{
	top: -74px;	
}

}

@media (min-width: 530px) and (max-width: 599px) {
section#about_us section#commitment dl dd div.right_box img.crow{
	top: -63px;	
}

}

@media (min-width: 450px) and (max-width: 529px) {
section#about_us section#commitment dl dd div.right_box img.crow{
	top: -53px;	
}

}

@media (min-width: 300px) and (max-width: 449px) {
section#about_us section#commitment dl dd div.right_box img.crow{
	top: -40px;	
}

}





section#about_us section#commitment dl dd div.dl_txt{
	padding: 0.5em 0;
}

section#about_us section#commitment dl dd p.dl_ttl{
	font-size:1.2em;
	margin: 1em 0 0em 0;
	padding: 0 1em;
}

section#about_us section#commitment ul.yellow{
	padding: 0 3em;
}

section#about_us section#commitment ul.yellow li{
    font-size: 0.9em;
}

section#about_us section#commitment dl dd p.dis{
	padding: 0 2em;
	font-size: 0.9em;
}

section#recruitment table{
	margin-top: 3em;
}

section#about_us section#recruitment div.flex{
	display:block;
	padding: 1.7em 0;
}

section#about_us section#recruitment div.flex img{
	width:100%;
	padding-top:1em;
}


/**************************  トップ  *******************************/

#slide div.slide_txt{
	width: 100%;
	margin: auto;
}

#slide div.slide_txt p.for {
    font-size: 1.5em;
	font-weight:600;
	text-shadow: 3px 3px 3px #000;
}

#slide div.slide_txt h3.slide_akane {
    font-size: 1.2em;
	font-weight:600;
}

#slide div.slide_txt h3.slide_akane img {
    width: 6%;
}

section#top_about div.dis{
	width:100%;
	padding: 1em 0;
	max-width:none;
}

section#top_about div.dis div.vertical{
	position: inherit;
	transform: translate(0%);
	top: 0;
	left: 0;
	width: 10.8em;
	padding-top: 1em;
	padding-bottom: 1.5em;
	display: block;
	margin: auto;
	
    width: 8em;
    padding-left: 0em;
}

section#top_about div.dis p.vertical {
    font-size: 1.5em;
}

section#top_about div.dis div.side{
	position: inherit;
	transform: translate(0%);
	top: 0;
	left: 0;
	margin-top: 1em;
}

div.side p.center_txt {
    text-align: center;
}

section#top_about div.dis p.side{
	text-align:center;
}

section#top_about div.flex{
	display:block;
}

section#top_about div.flex img.sp{
	width:100%;
	padding-top: 1em;
}

section#top_goods{
	background:none;
	padding-top:1em;
}

section#top_goods div.inner{
	padding: 1em 0;
}

section#top_goods img.tmt{
	display:none;
}

section#top_goods img.sp_tmt{
	width:100%;
	margin-top: 1em;
}

div.dis,
div.dis_02{
	width:100%;
	position: initial;
	top: 0;
    height: auto;
	margin-bottom:2em;
	margin:0;
	padding: 1.5em 0;
	max-width:none;
}

div.dis p.vertical {
    font-size: 1.5em;
}

div.dis div.vertical{
	position: inherit;
    transform: translate(0%);
    top: 0;
    left: 0;
    width: 7.8em;
    padding-top: 0em;
    padding-bottom: 1.5em;
    display: block;
    margin: auto;
}

p.btn {
    margin: 0;
    margin-top: 1em;
}

section#top_staff div.inner, section#top_recruit div.inner{
	background:none;
	padding: 1em 0;
}

div.dis_02 img{
	padding:0;
}

div.dis_02 img.ilust01, div.dis_02 img.ilust03{
	padding-top: 0em;
	padding-bottom: 1em;
}

div.dis img.ilust02{
	padding: 2em 0 0 0;
}

div.dis img.ilust03{
	padding: 0 0 1em 0;
}

section#top_staff{
	padding-top:1em;
}

section#top_staff div.many_photo{
	float:none;
	width:100%;
}

section#top_staff div.inner{
	padding:1em 0;
}

section#top_staff figure:nth-of-type(2n+1) {
    clear: both;
}

section#top_staff figure:nth-of-type(3n+1) {
    clear: inherit;
}

section#top_staff figure{
	width: 47%;
	margin: 1.5%;
}

section#top_staff figure.up {
    margin-bottom: 1.5%;
}

section#top_staff figure.e{
	margin: 1.5%;
}

section#top_staff figure.e{
}

section#top_recruit img.all{
	display:none;
}

section#top_recruit img.all_sp{
	width:100%;
	padding-top: 1em;
}

section#top_sns,
section#gallery {
	width: 100%;
	padding-bottom:5%;
	margin-top: 6%;
	float: none;
}
section#gallery ul {
    margin-left: 0.5%;
}
.face_book_box {
	max-width: 330px; width:100%;
}

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

section#contact_frame dl{
	padding-top: 4em;
	padding-bottom: 5em;
}

section#contact_frame dl dt{
	font-size: 1.2em;
	width: 50%;
}

section#contact_frame dl dd.txt{
	width: 56%;
}


}

@media (min-width: 530px) and (max-width: 599px){

section#contact_frame dl dt {
     padding-top: 4em;
     font-size: 1.5em;
     width: 65%;
     margin: 0 auto;
}

}
@media (min-width: 650px) and (max-width: 767px) {

#slide div.slide_txt p.for {
    font-size: 3em;
}

#slide div.slide_txt h3.slide_akane {
    font-size: 2em;
}

}


section#gallery ul,
section#top_recruit,
section#top_staff{
	padding-top: 1em;
}

section#gallery ul li:nth-of-type(2n+1) {
    clear: both;
}

section#gallery ul li{
	width:47%;
	margin: 1.5%;
}


/*************見やすく*****************/	
/*
body{
	background-image:none;
	background:#00D9D9;
}
*/
div.flex img.top_flex{
	display:none;
}

/****************　見やすく終わり　****************/


/********** 20200421 **********/
div.jam img.right{
    padding: 0;
    width: 100%;
    float: none;
}
div.jam h5{
	padding-top: 1em;
	margin-bottom: 1.5em;
}
table.jam th{
	width: 4em;
}
div.jam div.flex{
	display: block;
}
div.jam div.flex img{
	width: 100%;
	margin: 0 auto 1em auto;
}
table.jam td p.mail_btn a{
	font-size: 3.45vw;
}


/********* p_gallery *********/

#p_gallery li.in_left {
	inline-size: min(370px, 49%);
	margin-inline-end: 2%;
}

#p_gallery li.in_left:nth-of-type(2n) {
	margin-inline-end: 0;
}