@charset "UTF-8";
/*  modules
================================================ */
/*
Archive

mod_archive01
 
.mod_archive01 - base style
 
Markup:
<ul class="archive mod_archive01 {$modifiers}">
	<li class="item"><a href="#" class="alpha">
		<div class="img"><img src="http://wptest.mh-test.com/cms/wp-content/uploads/2015/07/pic_dummy01-640x400.png" class="attachment-pic640 size-pic640 wp-post-image" alt="" title="" width="576" height="360"></div>
		<ul class="meta">
			<li class="cat">カテゴリ</li>
			<li class="date">0000.00.00</li>
		</ul>
		<p class="sub">記事タイトル</p>
	</a></li>
</ul>
 
Styleguide 1.0.0
*/
/*
Button

mod_btn01
 
.mod_btn01 - base style
.mod_btn01.is_white - is_white
 
Markup:
<p class="mod_btn01 {$modifiers}"><a href="#">Button</a></p>
 
Styleguide 2.0.0
*/
.mod_btn01 { max-width: 240px; margin: 30px auto 0; text-align: center; }

.mod_btn01 a { display: block; padding: 10px 0; border: 1px solid #555; text-decoration: none; background: #555; color: #fff; }

@media all and (min-width: 600px) { .mod_btn01 { max-width: 300px; }
  .mod_btn01 a { padding: 15px 0; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
  .mod_btn01 a:hover { opacity: .7; } }

.mod_btn01.is_white a { background: #fff; color: #555; }

/*
Color

mod_color_blue

.mod_color_blue - Base styles

Markup:
<p class="tit fontSerif"><span class="mod_txt_line01 mod_color_blue">生活コストの<br>削減</span>が可能</p>

Styleguide 10.0.0
*/
.mod_color_blue { color: #2a5fa4; }

/*
Table

mod_faq01

.mod_faq01 - Base styles

Markup:
<div class="mod_faq01 {$modifiers}">
	<table><tbody>
		<tr>
			<th></th>
			<td></td>
		</tr>
	</tbody></table>
</div>

Styleguide 11.0.0
*/
.mod_faq01 { background-color: #fff; }

.mod_faq01 + .mod_faq01 { margin-top: 3px; }

.mod_faq01 .mod_faq01_question { cursor: pointer; position: relative; padding: 6px 19px 11px; }

.mod_faq01 .mod_faq01_question.is_active:after { -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }

.mod_faq01 .mod_faq01_question:before { content: ""; display: block; position: absolute; right: 0; bottom: 0; width: 20px; height: 100%; background-color: #648fc8; }

.mod_faq01 .mod_faq01_question:after { content: ''; width: 7px; height: 7px; border: 0px; border-top: solid 1px #fff; border-right: solid 1px #fff; -ms-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); position: absolute; top: 50%; right: 6px; margin-top: -7px; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }

.mod_faq01 .mod_faq01_question .tit { font-size: 1.3rem; text-indent: -1.8em; padding-left: 18px; }

.mod_faq01 .mod_faq01_question .tit span { position: relative; top: 0; font-size: 1.6rem; color: #2a5fa4; padding-right: 8px; }

.mod_faq01 .mod_faq01_question .tit .qTxt { font-size: 1.3rem; color: #555; }

.mod_faq01 .mod_faq01_answer { display: none; border-top: 1px dotted  #ccc; padding: 2px 15px 15px; line-height: 2; }

.mod_faq01 .mod_faq01_answer .tit { font-size: 1.2rem; text-indent: -2.3em; padding-left: 21px; }

.mod_faq01 .mod_faq01_answer .tit span { position: relative; top: 4px; padding: 0 8px 0 7px; font-size: 1.6rem; color: #2a5fa4; }

.mod_faq01 .mod_faq01_answer .tit .qTxt { font-size: 1.3rem; color: #555; }

.mod_faq01 .mod_faq01_answer .txt { padding-left: 20px; font-size: 1.2rem; margin-top: 8px; }

.mod_faq01 .mod_faq01_answer .list { padding-left: 20px; margin-top: 8px; }

.mod_faq01 .mod_faq01_answer .list .item { font-size: 1.2rem; text-indent: -1.2em; padding-left: 12px; }

@media all and (min-width: 600px) { .mod_faq01 .mod_faq01_question { padding: 7px 30px 18px; }
  .mod_faq01 .mod_faq01_question:before { width: 30px; }
  .mod_faq01 .mod_faq01_question:after { width: 10px; height: 10px; right: 8px; margin-top: -9px; }
  .mod_faq01 .mod_faq01_question .tit { font-size: 1.8rem; text-indent: -1.8em; padding-left: 18px; }
  .mod_faq01 .mod_faq01_question .tit span { top: 3px; padding-left: 15px; font-size: 2.4rem; padding-right: 8px; }
  .mod_faq01 .mod_faq01_question .tit .qTxt { top: 0; font-size: 1.8rem; }
  .mod_faq01 .mod_faq01_answer { padding: 3px 15px 25px; }
  .mod_faq01 .mod_faq01_answer .tit { font-size: 1.5rem; text-indent: -2.3em; padding-left: 59px; text-indent: -4.6em; }
  .mod_faq01 .mod_faq01_answer .tit span { top: 10px; padding: 0 18px 0 31px; font-size: 2.4rem; }
  .mod_faq01 .mod_faq01_answer .txt { padding-left: 50px; font-size: 1.5rem; }
  .mod_faq01 .mod_faq01_answer .list { margin-top: 0; padding-left: 64px; }
  .mod_faq01 .mod_faq01_answer .list .item { font-size: 1.5rem; } }

/*
Form

mod_form01

.mod_form01 - base style

Markup:
<div></div>

Styleguide 3.0.0
*/
.mod_form01 input[type="text"], .mod_form01 input[type="email"], .mod_form01 input[type="tel"], .mod_form01 textarea { display: inline-block; padding: 10px; width: 100%; background: #f3f3f3; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-size: 1.6rem; box-sizing: border-box; }

.mod_form01 textarea { height: 150px; max-width: 100%; min-width: 100%; width: 100%; resize: vertical; }

.mod_form01 .address .zip { display: inline-block; }

.mod_form01 .address .zip .input_wrap { display: inline-block; }

.mod_form01 .checkList br { display: none; }

.mod_form01 .checkWrap { display: inline-block; width: 100%; margin-bottom: 3px; }

.mod_form01 .checkWrap input[type="checkbox"] { display: none; }

.mod_form01 .checkWrap input[type="checkbox"]:checked ~ span:after { display: block; }

.mod_form01 .checkWrap label > span { position: relative; display: block; padding: 7px 0 7px 37px; width: 100%; border: 2px solid #e4e4e4; border-radius: 4px; box-sizing: border-box; }

.mod_form01 .checkWrap label > span:before { content: ""; position: absolute; top: 8px; left: 8px; width: 21px; height: 21px; border: 1px solid #afafaf; border-radius: 4px; box-sizing: border-box; }

.mod_form01 .checkWrap label > span:after { display: none; content: ""; position: absolute; top: 10px; left: 10px; width: 23px; height: 16px; background: url(../img/common/ico_check01.png) no-repeat center/contain; }

.mod_form01 table { border-bottom: 1px solid #e4e4e4; }

.mod_form01 table th { position: relative; vertical-align: middle; padding: 7px 15px 10px; border-top: 1px solid #e4e4e4; }

.mod_form01 table th .txt { display: inline-block; vertical-align: middle; font-size: 1.4rem; font-weight: bold; }

.mod_form01 table th .label { display: inline-block; padding: 4px 10px; margin-left: 8px; vertical-align: middle; background: #2a5fa4; color: #fff; font-size: 1.1rem; line-height: 1; }

.mod_form01 table td { padding: 0 15px 10px; vertical-align: middle; }

.mod_form01 table td.address { position: relative; }

.mod_form01 table td.address .zipIco { display: inline-block; vertical-align: middle; box-sizing: border-box; padding: 13px 0; }

.mod_form01 table td.address .zip { display: inline-block; vertical-align: middle; }

.mod_form01 table td.address .zip br { display: none; }

.mod_form01 table td.address .zip .error { position: absolute; left: 15px; bottom: 30px; }

.mod_form01 table td.address .addTxt { display: inline-block; margin-top: 10px; }

.mod_form01 table td.address .inputWrap { display: inline-block; vertical-align: middle; margin-top: 10px; padding-bottom: 5px; }

.mod_form01 table td.address .inputWrap input[type="text"] { display: inline-block; vertical-align: middle; }

.mod_form01 table td.address .inputWrap:last-child { display: block; padding-bottom: 0; }

.mod_form01 table td.address #your-postcode { width: 150px; }

.mod_form01 table td.address button { display: inline-block; margin-left: 5px; padding: 13px 14px; vertical-align: middle; background: #5d5d5d; border: 0; color: #fff; font-size: 1.2rem; -webkit-appearance: none; -moz-appearance: none; appearance: none; }

@media all and (max-width: 599px) { .mod_form01 table tr, .mod_form01 table th, .mod_form01 table td { display: block; } }

.mod_form01 #submitArea { padding: 20px 35px 0; }

.mod_form01 #submitArea input { position: relative; display: block; width: 100%; height: 60px; border: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; color: #fff; letter-spacing: .14em; font-size: 1.3rem; }

.mod_form01 #submitArea input[type="button"] { background: #5d5d5d; margin-bottom: 20px; }

.mod_form01 #submitArea input[type="submit"] { background: linear-gradient(135deg, #2a5fa4 0%, #1385b4 85%); }

.mod_form01 #submitArea input[type="submit"]:before { content: ""; position: relative; margin-right: 14px; top: -1px; display: inline-block; vertical-align: middle; width: 26px; height: 18px; background: url(../img/common/ico_mail02.png) no-repeat center/contain; }

.mod_form01 #submitArea input[type="submit"]:after { content: ""; position: absolute; top: 50%; right: 15px; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); display: inline-block; width: 9px; height: 18px; background: url(../img/common/arw_right02.png) no-repeat center/contain; }

.mod_form01 #errorMsg { padding: 0 15px 20px; text-align: center; color: #f00; }

.mod_form01 #errorMsg .error { font-weight: bold; }

@media all and (min-width: 600px) { .mod_form01 input[type="text"], .mod_form01 input[type="email"], .mod_form01 input[type="tel"], .mod_form01 textarea { padding: 13px 10px; }
  .mod_form01 textarea { height: 280px; }
  .mod_form01 .address .zip button { position: relative; bottom: 5px; }
  .mod_form01 .checkList { display: -webkit-box; display: -ms-flexbox; display: flex; width: 90%; height: 300px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: wrap column; flex-flow: wrap column; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }
  .mod_form01 .checkWrap { width: 370px; box-sizing: border-box; margin-bottom: 8px; }
  .mod_form01 .checkWrap label { cursor: pointer; }
  .mod_form01 .checkWrap label > span { padding: 11px 10px 11px 47px; font-size: 1.4rem; }
  .mod_form01 .checkWrap label > span:before { top: 15px; left: 14px; width: 20px; height: 20px; }
  .mod_form01 .checkWrap label > span:after { top: 14px; left: 18px; width: 24px; height: 18px; }
  .mod_form01 table { border-bottom: 0; }
  .mod_form01 table th { position: relative; padding: 25px 18px 25px 7px; width: 224px; box-sizing: border-box; background-clip: border-box; border-top: 0; border-bottom: 1px solid #e4e4e4; vertical-align: top; }
  .mod_form01 table th .txt { font-size: 1.6rem; }
  .mod_form01 table th .label { position: absolute; top: 25px; right: 18px; padding: 6px 11px; font-size: 1.3rem; }
  .mod_form01 table td { padding: 15px 18px; border-bottom: 1px solid #e4e4e4; }
  .mod_form01 table td.inputMin input { width: 500px; }
  .mod_form01 table td.address .zipIco { font-size: 1.5rem; }
  .mod_form01 table td.address .zip .error { left: 19px; bottom: 37px; }
  .mod_form01 table td.address .inputWrap { padding-bottom: 10px; }
  .mod_form01 table td.address .addTxt { width: 100%; }
  .mod_form01 table td.address #your-postcode { width: 251px; }
  .mod_form01 table td.address button { padding: 10px 21px; margin-left: 4px; font-size: 1.3rem; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; cursor: pointer; }
  .mod_form01 table td.address button:hover { opacity: .7; }
  .mod_form01 #submitArea { padding: 40px 0 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
  .mod_form01 #submitArea input { width: 400px; height: 70px; font-size: 1.5rem; background: linear-gradient(105deg, #2a5fa4 60%, #1385b4 90%); cursor: pointer; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
  .mod_form01 #submitArea input:hover { opacity: .7; }
  .mod_form01 #submitArea input[type="submit"]:before { width: 22px; height: 16px; }
  .mod_form01 #submitArea input[type="submit"]:after { right: 20px; }
  .mod_form01 #submitArea input[type="button"] { margin-right: 20px; }
  .mod_form01 #errorMsg { padding-bottom: 40px; } }

/*
Inner

mod_inner01
 
.mod_inner01 - base style
 
Markup:
<section id="hoge">
	<div class="inner mod_inner01 {$modifiers}">
		<h2 class="tit">タイトル</h3>
		<p class="txt">テキストが入ります。テキストが入ります。テキストが入ります。</p>
	</div>
</section> 

Styleguide 4.0.0
*/
.mod_inner01 { padding-left: 15px; padding-right: 15px; }

@media all and (min-width: 600px) { .mod_inner01 { box-sizing: border-box; width: 1100px; margin: auto; padding-right: 0; padding-left: 0; } }

/*
Pagination

mod_pagination01
 
.mod_pagination01 - base style
 
Markup:
<ul class="pagination mod_pagination01 {$modifiers}">
	<li class="previous"><a href="#">&lt;</a></li>
	<li class="current"><span>1</span></li>
	<li><a href="#">2</a></li>
	<li><a href="#">3</a></li>
	<li class="next"><a href="#">&gt;</a></li>
</ul>

Styleguide 5.0.0
*/
.mod_pagination01 { text-align: center; letter-spacing: -.5em; }

.mod_pagination01 li { display: inline-block; margin: 0 5px 10px; letter-spacing: 0; }

.mod_pagination01 li a, .mod_pagination01 li span { display: block; width: 30px; height: 30px; box-sizing: border-box; padding-top: 1px; border: 1px solid #000; text-decoration: none; }

.mod_pagination01 li.current span { color: #fff; background: #000; }

.mod_pagination01 li.previous { margin-right: 15px; }

.mod_pagination01 li.next { margin-left: 15px; }

@media all and (min-width: 600px) { .mod_pagination01 li { margin: 0 3px; }
  .mod_pagination01 li a, .mod_pagination01 li span { width: 30px; height: 30px; padding: 1px 0 0 0; font-size: 1.3rem; }
  .mod_pagination01 li a:hover, .mod_pagination01 li span:hover { text-decoration: none; border: 1px solid #034198; background-color: #034198; color: #fff; }
  .mod_pagination01 li.current { width: 30px; height: 30px; font-size: 1.3rem; padding: 4px 0 0 0; }
  .mod_pagination01 li.previous { margin-right: 0; }
  .mod_pagination01 li.next { margin-left: 0; } }

/*
Pagination

mod_pagination02
 
.mod_pagination02 - base style
 
Markup:
<ul class="pagination mod_pagination02 {$modifiers}">
	<li class="previous"><a href="">前へ</a></li>
	<li class="back"><a href="/blog/">一覧へ</a></li>
	<li class="next"><a href="">次へ</a></li>
</ul>

Styleguide 5.0.1
*/
/*
Single

mod_single01
 
.mod_single01 - base style
 
Markup:
<article class="mod_single01 {$modifiers}">
	<div class="thum"><img src="https://placehold.jp/810x522.png" alt=""></div>
	<header class="head">
		<div class="meta">
			<ul class="tag mod_tag01 is_black">
				<li>ニュース</li>
			</ul>
			<time class="date">2019.12.12</time>
		</div>
		<h1>年末年始休業日お知らせ</h1>
	</header>
	<div class="content">
		<p>12/29(土)～1/6(日)まで誠に勝手ながら冬季休暇とさせていただきます。<br>新年2019年1月7日より通常営業致します。</p>
		<p>テキストテキストテキストテキストテキストテキストテキストテキスト<br>テキストテキストテキストテキストテキストテキストテキストテキストテキスト<br>テキストテキストテキストテキストテキストテキストテキストテキストテキスト</p>
	</div>
	<p class="btn mod_btn01"><a href="/news/">一覧に戻る</a></p>
</article>

Styleguide 6.0.0
*/
.mod_single01 { padding: 40px 25px; background: #fff; }

.mod_single01_head { margin-top: 20px; }

.mod_single01_head h1 { margin-top: 8px; font-size: 2rem; font-weight: 700; letter-spacing: .06em; }

.mod_single01_tag { display: inline-block; margin-right: 5px; }

.mod_single01_date { display: inline-block; color: #999; letter-spacing: .1em; }

.mod_single01_content { margin-top: 12px; }

.mod_single01_content *:first-child { margin-top: 0; }

.mod_single01_content *:last-child { margin-bottom: 0; }

.mod_single01_content p { margin: 10px 0; }

@media all and (min-width: 600px) { .mod_single01 { padding: 60px; }
  .mod_single01_head { margin-top: 40px; }
  .mod_single01_head h1 { margin-top: 15px; font-size: 3rem; }
  .mod_single01_tag { margin-right: 11px; }
  .mod_single01_content { margin-top: 24px; }
  .mod_single01_content p { margin: 26px 0; }
  .mod_single01_btn { width: 330px; margin: 40px auto 0; } }

/*
Table

mod_table01

.mod_table01 - Base styles

Markup:
<div class="mod_table01 {$modifiers}">
	<table><tbody>
		<tr>
			<th></th>
			<td></td>
		</tr>
	</tbody></table>
</div>

Styleguide 7.0.0
*/
.mod_table01 table { border-top: 1px solid  #dadada; }

.mod_table01 th { width: 70px; background-color: #f3f6fb; border-bottom: 1px solid  #dadada; vertical-align: middle; padding: 10px 10px; font-size: 1.2rem; }

.mod_table01 td { border-bottom: 1px solid  #dadada; vertical-align: middle; padding: 10px 10px; font-size: 1.2rem; }

@media all and (min-width: 600px) { .mod_table01 th { width: 90px; padding: 5px 20px; font-size: 1.5rem; }
  .mod_table01 td { padding: 5px 20px; font-size: 1.5rem; } }

/*
mod_table02

.mod_table02 - Base styles

Markup:
<div class="mod_table02 {$modifiers}">
	<table><tbody>
		<tr>
			<th></th>
			<td></td>
		</tr>
	</tbody></table>
</div>

Styleguide 7.2.0
*/
.mod_table02 table { border-top: 1px solid  #dadada; }

.mod_table02 th { width: 70px; background-color: #648fc8; border-bottom: 1px solid  #dadada; padding: 10px; font-size: 1.2rem; color: #fff; }

.mod_table02 td { border-bottom: 1px solid  #dadada; vertical-align: middle; padding: 10px; font-size: 1.2rem; }

.mod_table02 td .mod_table02_txt + .mod_table02_list { margin-top: 15px; }

.mod_table02 td .mod_table02_list .mod_table02_item { text-indent: -1.1em; padding-left: 11px; }

.mod_table02 td .mod_table02_list + .mod_table02_txt { margin-top: 15px; }

.mod_table02 td a { color: #2a5fa4; }

@media all and (min-width: 600px) { .mod_table02 th { width: 180px; padding: 12px 30px; font-size: 1.5rem; }
  .mod_table02 td { padding: 12px 30px; font-size: 1.5rem; }
  .mod_table02 td .mod_table02_txt + .mod_table02_list { margin-top: 30px; }
  .mod_table02 td .mod_table02_list + .mod_table02_txt { margin-top: 30px; }
  .mod_table02 td a { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
  .mod_table02 td a:hover { text-decoration: none; } }

/*
Title

mod_tit01

.mod_tit01 - Base styles

Markup:
<header class="mod_tit01">
	<p class="mod_tit01_sub fontCaveat">RECRUIT</p>
	<h2 class="mod_tit01_main fontSerif">求人フォーム</h2>
</header>

Styleguide 8.0.0
*/
.mod_tit01 { position: relative; text-align: center; padding-bottom: 20px; margin-bottom: 20px; }

.mod_tit01_sub { color: #2a5fa4; font-size: 1.4rem; font-weight: bold; line-height: 1.2; letter-spacing: .06em; }

.mod_tit01_main { padding-top: 10px; font-size: 2rem; font-weight: 500; line-height: 1.2; letter-spacing: 0; }

.mod_tit01:before { content: ""; position: absolute; left: 50%; bottom: 0; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); width: 35px; height: 1px; background: #2a5fa4; }

.mod_tit01.is_white { color: #fff; }

.mod_tit01.is_white .mod_tit01_sub { color: #fff; }

.mod_tit01.is_white:before { background: #fff; }

@media all and (min-width: 600px) { .mod_tit01 { padding-bottom: 28px; margin-bottom: 28px; }
  .mod_tit01_sub { font-size: 2rem; }
  .mod_tit01_main { margin: auto; padding-top: 13px; font-size: 4rem; }
  .mod_tit01:before { width: 60px; height: 2px; } }

/*
Text

mod_txt_line01

.mod_txt_line01 - Base styles

Markup:
<p class="tit fontSerif"><span class="mod_txt_line01 mod_color_blue">生活コストの<br>削減</span>が可能</p>

Styleguide 9.0.0
*/
.mod_txt_line01 { position: relative; border-bottom: 1px solid #2a5fa4; }

.mod_txt_line01:after { position: absolute; left: 0; bottom: -4px; content: ""; display: block; width: 100%; height: 1px; background: #2a5fa4; }