@import "/common/js/nav/styles.css";
@media only screen and (max-width:600px){
#device { display:block;}
#device p.pc_btn { display:none; }
#device p.sp_btn { display:block; }
}

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

body { min-width:100%; font-size:100%;}
#header { width:100%;}
#content{ width:100%;}
#footer { width:100%;}

#wrapper { background:#FFF; border-top:none; overflow:hidden;}
#base { width:auto; margin:0 !important;}

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

#device p.pc_btn { display:block !important;}
#device p.sp_btn { display:none !important;}

/*====================================================================================================
  HEADER
====================================================================================================*/

#header { margin: 0 auto; width:100%!important; box-sizing: border-box;}

#header a{  }
#header a:hover{ }

/*** LOGO ******************************************************************/

#header h1 { display: none;}
#header .head_menu{ display: none;}

/*** NAVI ******************************************************************/

nav{ display: none;}
	
/*** SEARCH ******************************************************************/
	
.kensaku_sm{ margin-left: 20px!important;}
.kensaku_sm .kensakuh_bn{ margin: 2px 0 0 0!important;}
.kensaku_sm span input { margin: 0!important; border: none!important;}
.kensaku_sm span.kensaku_input_box input { padding: 0!important; height: 23px!important;}
.kensaku_sm span.kensakuh_bn input { padding: 2px 5px!important; color: #FFF!important; background: #4F9FD6!important;}

/*** LANG ******************************************************************/

.kensaku_sm .language { margin: 10px 0 0; width: 94%; box-sizing: border-box;}
.kensaku_sm .language  p{ float: left; width: 49%; height: 25px;}
.kensaku_sm .language p a{ display: block; color: #FFF; text-align: center; background: #4F9FD6;}
.kensaku_sm .language p:nth-child(1){ margin-right: 2%;}

/*** SLIDE ******************************************************************/

.header_photo img{ width: 100%; height: auto;}

/*====================================================================================================
  CONTENT
====================================================================================================*/

#content {}

/*====================================================================================================
  FOOTER
====================================================================================================*/

#footer { margin: 0 auto; padding: 0 30px 10px; width:100%;}

#footer .f_nav ul{ display: none;}
#footer .f_nav ul li{ float: left; margin-right: 10px;}
#footer .f_nav ul li:after{ display: inline; margin-left: 10px; content: '|';}
#footer .f_nav ul li:last-child:after{ display: none;}
#footer .f_nav p{ float: none; width: 100%;}

#footer .f_acc{
	padding: 15px 0 20px;
	font-size: 75%;
}

#footer .f_acc .acc_left{ float: left; line-height: 20px;}
#footer .f_acc .acc_right ul{ display: none;}
#google_translate_element{ float: right; margin-top: 10px; width: 130px; text-align: right;}


/*====================================================================================================
  TOP PAGE
====================================================================================================*/

	
	
	
/*====================================================================================================
  SUB PAGE
====================================================================================================*/

#google_translate_element{ clear: both; float: none; padding-top: 20px; width: 100%; text-align: left;}
	
.header_br{
	margin: 0 auto;
	width: 100%;
	height: auto;
	background: none;
	text-indent: 0px;
}
.header_br img{ width: 100%; height: auto;}
	
#subpage { 
	float: none;
	margin: 0 auto !important;
	padding: 5% 0;
	width:100%;
	border-left: none;
}
#sub_menu{ display: none;}
.pan{ display: none;}


/* MIDASHI */
#subpage h3 { margin:0 0 20px; padding: 2.5% 4%; height: auto; font-size: 100%;}
#subpage h4 { margin:0 0 20px; font-size: 100%;}

/* CATCH COPY */
#subpage .catch { margin:0 2% 20px; font-size: 120%;}

/* COMMON */
#subpage .comment1 { margin:0 2% 20px;}
#subpage .comment2 { margin:0 2% 20px; padding:5%;}
#subpage .comment3 { margin:0 2% 20px; padding:5%;}

/* HYOU */
#subpage table.hyou { margin:0 2%; width:96%; table-layout:auto;}
#subpage table.hyou th,
#subpage table.hyou td{
	table-layout:auto !important;
	display:block !important;
	padding:5% !important;
	width:90% !important;
	height:auto !important;
}
#subpage table.pc_tit { display:none;}
#subpage table.hyou .sm_mid { display:block;}

/* 2RETU */
#subpage table.hyou2 td table {}
#subpage table.hyou2 td table th,
#subpage table.hyou2 td table td {
	display:table-cell !important;
	padding:5% !important;
	width:auto !important;
	height:auto !important;
}

/* 3RETU */
#subpage table.hyou3 { border-top:1px solid #DDD;}
#subpage table.hyou3+table.hyou3 { border-top:1px solid #DDD;}

/* 4RETU */
#subpage table.hyou4 {border-top:1px solid #DDD;}
#subpage table.hyou4+table.hyou4 { border-top:1px solid #DDD;}

/* 5RETU */
#subpage table.hyou5 { border-top:1px solid #DDD;}
#subpage table.hyou5+table.hyou5 { border-top:1px solid #DDD;}

/* FREE */
#subpage .pc_table { display:none;}
#subpage .sm_table { display:block;}
#subpage .sm_table table td { padding:5% !important;}

/* LIST */
#subpage ul.list-ul { margin:20px 2%;}

/* LINK */
#subpage .link-box { width:100%; margin:0 2%;}
#subpage .link-box:after { display:none;}
#subpage .link2 .link {width:auto;}
#subpage .link3 .link {width:auto;}
#subpage .link4 .link {width:auto;}
#subpage .file-box { width:100%; margin:0 2%;}
#subpage .file-box:after { display:none;}
#subpage .file-box .file img {padding-right:10px;}
#subpage .file2 .file {width:auto;}
#subpage .file3 .file {width:auto;}
#subpage .file4 .file {width:auto;}

/* EMBEDDED */
#subpage .embedded { margin:0 2% 20px;}

/* PHOTO BOX */
#subpage ul.photo_box { clear:none !important; float:none !important; margin:2%; width:96% !important; text-align:center;}
#subpage ul.g1 li,
#subpage ul.g2 li,
#subpage ul.g3 li,
#subpage ul.g4 li,
#subpage ul.g5 li{ margin:15px 0; width:100%; text-align:center;}
#subpage ul.g1 li.photo img,
#subpage ul.g2 li.photo img,
#subpage ul.g3 li.photo img,
#subpage ul.g4 li.photo img,
#subpage ul.g5 li.photo img { max-width:240px !important; height:auto !important;}

/* BOX */
#subpage .temple-box { margin:0 2%; width:96%;}
#subpage .temple-box:after { display:none;}
#subpage .box1,
#subpage .box2 { float:none;margin: 0 2% 20px; width:96%;}
#subpage .box1:after,
#subpage .box2:after { display:none;}
#subpage .box1 .catch { margin:0 0 20px !important;}
#subpage .box1 h4,
#subpage .box2 h4 { margin:10px 0; font-size:100%;}
#subpage .photo-c { float:none; padding:0; width:100%;}
#subpage .photo-c img { max-width:240px !important; height:auto !important; padding:0 0 20px;}
#subpage .photo-l,
#subpage .photo-r { float:none; padding:0; width:100%; text-align:center;}
#subpage .photo-l img,
#subpage .photo-r img { max-width:240px !important; height:auto !important; padding:0 0 20px;}


/* LINE */
#subpage .line {
	margin:0 2% 20px;
	height:50px;
	background-size:100% auto;
}

/* BUTTON */
#subpage .btn { float:none; margin:1% 2%;}
#subpage .b1,
#subpage .b2,
#subpage .b3 { width:auto;}

	

/*====================================================================================================
  Other
====================================================================================================*/
	
.mr01{ margin: 0 0 40px 0;}

	
/*====================================================================================================
  PRODUCTS
====================================================================================================*/
	
#products .po_title{ color: #FFCC00; background: #88867C; padding-left: 5px; font-weight: bold;}
	
#products .point{ margin-bottom: 10px; padding: 10px; font-size: 90%; font-weight: bold; box-sizing: border-box;}
#products .p01,
#products .p02,
#products .p03{ padding-left: 0; height: auto; background: none;}
	
#products .point ul li{ border-bottom: none; font-weight: normal;}
#products .point ul li:before{ content: '・';}
#products .p01 ul li:nth-child(1){ display: inline-block; margin-bottom: 5px; padding: 0 5px; font-weight: bold; background: #FFCC00;}
#products .p01 ul li:nth-child(1):before{ content: '';}
	
#products .t_ichiran{}
#products .t_ichiran p{ float: left; margin-bottom: 10px; width: 48%; margin-right: 2%;}
#products .t_ichiran p:last-child{ margin-right: 0;}
#products .t_ichiran p img{ width: 100%;}
	
#products .p_main .box1 img {  width: 100%;}
	
#products ul.siyou_list{ font-size: 90%;}
#products ul.siyou_list li{ float: none; margin-bottom: 5px; width: 100%; background: #B7D7ED; text-align: center;}
	
#products .come ul.siyou_list2{ margin-bottom: 20px; width: 100%;}

h2.h2_pr{ padding: 3%; height: auto; font-size: 150%; box-sizing: border-box;}
h2.h2_pr:after { /* float clear*/ display:block; clear:both; content:"";}

h2.h2_pr .sm{}
h2.h2_pr .sm span{ float: right; padding: 0 2%; font-size: 13px; background: #4D9FD8;}
	
#products .tokucho{}
#products .tokucho .to_list{ width: 100%;}
#products .tokucho .to_list:nth-child(1),
#products .tokucho .to_list:nth-child(2){ float: none;}
#products .tokucho .to_list .photo{ text-align: center;}


#products .seihin_list{ margin-bottom: 0;}

#products .seihin_list ul{ float: none; margin-bottom: 20px;}
#products .seihin_list ul li:nth-child(1){ padding: 20px 2% 3%; width: 100%;}
#products .seihin_list ul li img{ width: 200px; height: auto;}
#products .seihin_list ul li:nth-child(2){ font-size: 12px;
    line-height: 1.1em;
    font-weight: bold;
    background-color: #4D9FD7;
    text-align: center;
    padding: 5px 0;
    color: #FFF;
}
#products .seihin_list ul li p{
    margin-top: 10px;
   font-size: 75%;
    font-weight: bold;
}

#products .ul_size1{}
#products .ul_size1 ul{ width: 100%!important; margin-right: 0px;}
#products .ul_size1 ul:last-child{ width: 100%;}

#products .ul_size2 ul{ width: 100%; margin-right: 0px;}
#products .ul_size2 ul img { height: auto;}
#products .ul_size2 ul:nth-child(4){ width: 100%;}

#products .ul_size3 ul{ width: 100%; margin-right: 0px;}
#products .ul_size3 ul:nth-child(4){ width: 100%;}
#products .ul_size3 ul:nth-child(1) li:nth-child(1),
#products .ul_size3 ul:nth-child(2) li:nth-child(1){ padding-top: auto; height: auto;}
#products .ul_size3 ul:nth-child(3) li:nth-child(1),
#products .ul_size3 ul:nth-child(4) li:nth-child(1){ height: auto;}
#products .ul_size3 ul:nth-child(5),
#products .ul_size3 ul:nth-child(6){ width: 100%;}

#products .ul_size4{}
#products .ul_size4 ul{ width: 100%; margin-right: 0;}
#products .ul_size4 ul:nth-child(3){ width: 100%;}

#products .ul_size5{}
#products .ul_size5 ul:nth-child(1),
#products .ul_size5 ul:nth-child(2){ width: 100%; margin-right: 0;}
#products .ul_size5 ul:nth-child(3){ width: 100%;}

#products .ul_size5 ul:nth-child(1) li:nth-child(1),
#products .ul_size5 ul:nth-child(2) li:nth-child(1)
#products .ul_size5 ul:nth-child(3) li:nth-child(1){padding-top: auto;}
	
#products .ul_size6{}
#products .ul_size6 ul{ width: 100%;}

#products .ul_size7{}
#products .ul_size7 ul{ float: none; width:100%; margin-right: 0;}
#products .ul_size7 ul:nth-child(2){ float: none; width:100%;}
	
.f_link{ display: none;}
	
/*====================================================================================================
  MERIT
====================================================================================================*/

#merit .voice{}
#merit .voice h4{
	margin: 0!important;
	padding: 8px 8px 8px 10px;
	width: 100%;
	color: #000;
	font-weight: bold;
	font-size: 12px;
	line-height: 1.2em;
	background-color: #BCC8D1;
	display: inline-block;
	letter-spacing: 1px;
}

#merit .voice .photo-l{ display: none;}


#merit .voice ul.list{
	float: none;
	width: 100%;
	margin-bottom: 20px;
	padding: 2% 30px;
	font-size: 13px;
	background: #E6E8DC;
	box-sizing: border-box;
}
#merit .voice ul.list li{
	display: list-item;
	list-style: disc!important;
}
#merit .v01 { margin: 0;}
#merit .v02 {}

#merit .v01 a:hover,
#merit .v02 a:hover{ background: #333 url(/image/yajirushi2.png) no-repeat 9px center!important; }
	
/*====================================================================================================
  service
====================================================================================================*/

#service .se_tit{}
#service .se_tit p { padding-bottom: 15px; border-bottom: #7A7A75 1px solid;}
#service .se_tit p span{ display: block; padding: 0 1%; font-weight: bold;}
#service .se_tit p .bk_g{ margin-bottom: 10px; color: #FFF; background: #669900;}
#service .se_tit p .bk_m{
	font-size: 130%;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}

#service .se_tit2 {
	padding: 10px 0;
	font-size: 130%;
	font-weight: bold;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	border-top: #7A7A75 1px solid;
	border-bottom: #7A7A75 1px solid;
}
	
#service table.eigyo{
	clear:both;
	margin:10px 0;
	width:100%;
	font-size: 90%;
	border-collapse:collapse;
	border-top:1px solid #AAA;
	border-left:none;
}
#service table.eigyo th,
#service table.eigyo td { border-bottom:1px solid #AAA;}
#service table.eigyo td.last { border-bottom:none}
#service table.eigyo th {
	padding-top: 3%!important;
	padding-bottom: 3%!important;
	background:none;
	font-weight:bold;
	width: 100%;
	border-right:none;
}
#service table.eigyo td { background:none; padding: 15px 10px; border-right:none;}
#service table.eigyo td p{ margin-bottom: 5px;}
	
#service .stf_list{ margin: 20px 0;}
#service .stf_list .photo-l{ padding-bottom: 20px;}
#service .stf_list .photo-l img{ padding-bottom: 0;}

#service .stf_list{ margin-bottom: 30px; border-bottom: #999 1px solid;}
#service .stf_list .come{ font-size: 90%; overflow: hidden;}
#service .stf_list .come ul{ display: block; padding: 8px 0; width: 100%;}
#service .stf_list .come ul li{ padding: 0;	display: block;}
#service .stf_list .come ul li:nth-child(1){ width: 100%; padding-bottom: 8px;}
#service .stf_list .come ul li:nth-child(2){ width: 100%;}
	
#service .se_f { border-top:none;}
#service .se_f .photo-l img{ margin-bottom: 20px; padding-bottom: 0;}

	
	
/*====================================================================================================
  RECRUIT
====================================================================================================*/

#recruit{}

#recruit .kodawari{ margin-top: 25px;}

#recruit .kodawari .rec_left{ float: none; width: 100%;}
#recruit .kodawari .rec_left h4.s_tit{ width: 100%!important;}
#recruit .kodawari .rec_left .ko_txt{ margin-bottom: 20px;}

#recruit .kodawari .rec_right{
	float: none;
	margin-bottom: 30px;
	padding: 15px 20px 20px 20px;
	width: 100%;
	box-sizing: border-box;
}
#recruit .kodawari .rec_right ul li{
	margin: 0 0 2px;
	padding: 8px 0 8px 15px;
	font-size: 12px;
	font-weight: bold;
	background: url(/image/yajirushi.png) left 8px no-repeat;
	border-bottom: 1px solid #CCC;
}

#recruit .social_archive{ }
#recruit .social_archive li { line-height: 20px;}


	
#recruit .motome_tit{ 
	padding: 10px 0;
	font-size: 120%;
	font-weight: bold;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	text-align: center;
	border-top: double 3px #666;
	border-bottom: double 3px #666;
}

#recruit .mess{ margin: 0;}
#recruit .mess .photo-l{ margin-right: 20px;}
#recruit .mess .come{ overflow: hidden;}
#recruit .mess .come p:nth-child(1){ margin:10px 0;}

#recruit .mess h4,
#recruit .cult h4{
	color: #333;
	font-size: 120%;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

#recruit .cult h4{ border-bottom: solid 1px #666;}
#recruit .cult .photo-r{ padding-bottom: 0;}

#recruit .busyo{ }
#recruit .busyo ul{ margin-bottom: 10px;}
#recruit .busyo ul li{ float: left; padding: 5px 0 5px 15px; line-height: 21px;}
#recruit .busyo ul li:nth-child(1){ width: 100%;}
#recruit .busyo ul li:nth-child(2){ padding: 10px; width: 100%; box-sizing: border-box;}

#recruit .kikai ul{ border: 1px solid #336600;}
#recruit .suisan ul{ border: 1px solid #476883;}

#recruit .voice{
	margin: 10px 0;
	padding: 20px;
	width: 100%;
}
#recruit .voice .photo-r img{ max-width: 180px!important;}
#recruit .voice .come{ font-size: 94%!important; line-height: 22px; overflow: hidden;}
#recruit .voice .come p{ margin-bottom: 10px;}
#recruit .voice .come ul{}
#recruit .voice .come ul li{}

#recruit .que {
	margin: 20px 0 15px 0;
    padding: 10px 10px 10px 45px;
    font-size: 12px;
    line-height: 1.5em;
    font-weight: bold;
    background: #BCC8D1;
	box-sizing: border-box;
}

#recruit .q01{ background: #BCC8D1 url("/image/recruit/q1.gif") no-repeat 10px 6.5px;}
#recruit .q02{ background: #BCC8D1 url("/image/recruit/q2.gif") no-repeat 10px 6.5px;}
#recruit .q03{ background: #BCC8D1 url("/image/recruit/q3.gif") no-repeat 10px 6.5px;}
#recruit .q04{ background: #BCC8D1 url("/image/recruit/q4.gif") no-repeat 10px 6.5px;}
#recruit .q05{ background: #BCC8D1 url("/image/recruit/q5.gif") no-repeat 10px 6.5px;}

#recruit .ans{ font-size: 90%;}


#recruit .time{
	margin: 20px 0 50px;
	padding: 20px;
	width: 100%;
	background: #f4f4f4;
	border: 2px solid #336600;
	box-sizing:border-box;
}
#recruit .time h4{
	margin: 0 0 10px;
	padding: 0 0 5px!important;
	color: #336600;
	font-weight: bold;
	border-bottom: 2px solid #336600;
	font-size: 14px;
	overflow: hidden;
}
#recruit .time .photo-r img{ max-width: 180px!important;}
#recruit .time .come{ margin-top: 15px; font-size: 90%;}
#recruit .time .come ul{ margin-bottom: 15px; width: 100%; overflow-x: hidden; line-height: 20px; box-sizing: border-box;}
#recruit .time .come ul li:nth-child(1){ float: none; text-align: left; font-weight: bold; border-right: none;}
#recruit .time .come ul li:nth-child(2){ float: none;}

#recruit .time .t01 ul li:nth-child(1){ padding-right: 0; width: 100%;}
#recruit .time .t01 ul li:nth-child(2){ padding-left: 0; width: 100%;}

#recruit .time .t02 ul li:nth-child(1){ padding-right: 0; width: 100%;}
#recruit .time .t02 ul li:nth-child(2){ padding-left: 0; width: 100%;}
	

#recruit table.re_hyo{
	margin: 5px 0 20px;
	width:100%!important;
	border-collapse:collapse;
	border-top:1px solid #AAA;
	border-left:1px solid #AAA;
	box-sizing: border-box;
}
#recruit table.re_hyo th,
#recruit table.re_hyo td { border-bottom:1px solid #AAA; font-size: 90%; padding: 2% 5% !important;}
#recruit table.re_hyo th {
	width: 20%;
	font-weight:bold;
	text-align:left;
	background:#EEE;
	border-right:1px solid #AAA;
}
#recruit table.re_hyo td { background:#FFF; border-right:1px solid #AAA; padding: 5px 10px;}
	
	
	
/*====================================================================================================
  COMPANY
====================================================================================================*/

#company{}
#company .com_list{ width: 100%;}
#company .com_list:after { /* float clear*/ display:block; clear:both; content:"";}

#company .com_list{}
#company .com_list ul{ margin-bottom: 20px; width: 100%; float: none;}
#company .com_list ul:nth-child(even){ float: none;}

#company .com_list ul li a{
	display: block;
	padding: 2% 5%;
	color: #FFF;
	font-size: 15px;
	font-weight: bold;
	background: url("/image/yajirushi2.png") no-repeat 0 center;
}


#company .com_list ul li{ box-sizing: border-box;}
#company .com_list ul li:nth-child(1){ background: url("/image/blue_back.jpg") no-repeat;	background-size: cover;}
#company .com_list ul li:nth-child(1):hover{background:#4D9FD8;}
#company .com_list ul li:nth-child(2){ padding: 2% 5%;}

#company table.info {
	margin: 0;
	width:100%;
	border-collapse:collapse;
	border-top:1px solid #AAA;
	border-left:1px solid #AAA;
}
#company table.info th,
#company table.info td { border-bottom:1px solid #AAA;}
#company table.info th {
	padding: 3%!important;
	background:#EEE;
	font-weight:bold;
	text-align:left;
	width: 94%!important;
	border-right:1px solid #AAA;
}
#company table.info td { background:#FFF; width: 94%!important; padding: 3%!important; border-right:1px solid #AAA;}

#subpage table.info2 th{ border-right: none;}
#subpage table.info2 th,
#subpage table.info2 td{
	table-layout:auto !important;
	display:block !important;
	padding:5% !important;
	width:90% !important;
	height:auto !important;
}

#company table.info2 iframe{ width: 100%;}
#company table.info2 img{ width: 100%;}
#company table.info2 .embedded{ margin: 0;}	

/*====================================================================================================
  PAGE TITLE
====================================================================================================*/
	
#staff{}
#staff .staff_ba p{ margin-bottom: 2%;}
#staff .staff_ba p img{ width: 100%; height: auto;}
#staff .staff_name{ margin-bottom: 10px;}


/*====================================================================================================
  QUESTIONATY
====================================================================================================*/

#questionaty{}
#questionaty .questionnaire_list{ margin-bottom: 20px;}
#questionaty .questionnaire_list:after { /* float clear*/ display:block; clear:both; content:"";}

#questionaty h3{ margin-bottom: 0;}
	
#questionaty .questionnaire_list ul{ width: 100%;}
#questionaty .questionnaire_list ul:nth-child(1),
#questionaty .questionnaire_list ul:nth-child(2){ float: none;}

#questionaty .questionnaire_list li{
	padding-left: 10px;
	width: 100%;
	background: url("/image/yajirushi.png") no-repeat left center;
	box-sizing: border-box;
}

#questionaty .questionnaire_list li a {color: #4D9FD7;}
#questionaty .questionnaire_list li a:hover {color:#333;}

#questionaty .questionary_block{}
#questionaty .questionary_block .date{}

#questionaty .questionary_block .answer{ margin-bottom: 20px;}
#questionaty .questionary_block .answer:last-child{ margin-bottom: 40px;}
#questionaty .questionary_block .answer p{}
#questionaty .questionary_block .answer p:nth-child(1){
	display: block;
	margin: 10px 0;
	padding: 7px 15px;
	font-size: 12px;
	background: #FFFFFF;
}
#questionaty .questionary_block .answer p:nth-child(2){
	padding: 7px 15px;
	background: #FFF;
}
	
/*====================================================================================================
  PAGE TITLE
====================================================================================================*/

/*====================================================================================================
  PAGE TITLE
====================================================================================================*/
}
