@charset "UTF-8";
/*=============================================================
 04_modules
=============================================================*/
/*!  button
================================================ */
.mod_btn01 > * { display: block; border-radius: 6px; background: #ef5c26; background: -webkit-gradient(left top, left bottom, color-stop(0%, #ef5c26), color-stop(50%, #ef5c26), color-stop(51%, #fa6f3d), color-stop(100%, #fa6f3d)); background: -webkit-linear-gradient(top, #ef5c26 0%, #ef5c26 50%, #fa6f3d 51%, #fa6f3d 100%); background: linear-gradient(to bottom, #ef5c26 0%, #ef5c26 50%, #fa6f3d 51%, #fa6f3d 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ef5c26', endColorstr='#fa6f3d', GradientType=0 ); color: #fff; font-weight: 800; text-align: center; font-size: 1.8rem; position: relative; padding: 7px 0; width: 100%; }
@media screen and (min-width: 600px) { .mod_btn01 > * { cursor: pointer; }  .mod_btn01 > *:hover { background: #d73d09; background: -webkit-gradient(left top, left bottom, color-stop(0%, #d73d09), color-stop(50%, #d73d09), color-stop(51%, #e5511f), color-stop(100%, #e5511f)); background: -webkit-linear-gradient(top, #d73d09 0%, #d73d09 50%, #e5511f 51%, #e5511f 100%); background: linear-gradient(to bottom, #d73d09 0%, #d73d09 50%, #e5511f 51%, #e5511f 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d73d09', endColorstr='#e5511f', GradientType=0 ); } }
/*!  pager
================================================ */
.mod_pagination01 { display: block; padding: 20px 0; text-align: center; font-size: 0; margin: -10px; }
.mod_pagination01 li { display: inline-block; width: 30px; margin: 10px; }
.mod_pagination01 li a, .mod_pagination01 li span { display: block; line-height: 1; font-size: 12px; color: #888; padding: 7px 0 5px; box-sizing: border-box; border: 2px solid #888; background-color: #fff; text-decoration: none; }
.mod_pagination01 .prev { width: 50px; margin-right: 15px; }
.mod_pagination01 .next { width: 50px; margin-left: 15px; }
.mod_pagination01 .current { color: #fff; background-color: #888; }
/*
#styleguide
mod_pagination01

pager

```
<div class="mod_pagination01">
	<ul class="links">
		<li class="prev"><a href="">前へ</a></li>
		<li><a href="">1</a></li>
		<li class="current"><span>2</span></li>
		<li><a href="">3</a></li>
		<li class="next"><a href="">次へ</a></li>
	</ul>
</div>
```
*/
/*!  tit
================================================ */
.mod_tit01 { font-size: 2.4rem; font-weight: 700; color: #fff; background: #345c8d; border-left: 7px solid #164176; padding: 12px 0 7px 15px; margin: 0 0 20px; line-height: 1.5; }
@media screen and (min-width: 600px) { .mod_tit01 { font-size: 2.8rem; padding: 15px 0 13px 30px; margin: 0 0 30px; border-left: 15px solid #164176; } }
.mod_tit02 { font-size: 1.9rem; font-weight: 700; color: #345c8d; padding: 0 0 8px; border-bottom: 2px solid #345c8d; margin: 0 0 15px; }
@media screen and (min-width: 600px) { .mod_tit02 { font-size: 2.6rem; padding: 0 0 15px; margin: 0 0 30px; } }
.mod_tit03 { font-size: 1.6rem; line-height: 1.5; font-weight: 700; color: #345c8d; position: relative; padding: 0 0 0 14px; margin: 0 0 10px; }
.mod_tit03:before { content: ""; display: block; position: absolute; top: 3px; left: 0; width: 4px; height: 16px; background: #345c8d; }
@media screen and (min-width: 600px) { .mod_tit03 { font-size: 2.2rem; padding: 0 0 0 20px; margin: 0 0 20px; }  .mod_tit03:before { top: 4px; width: 5px; height: 22px; } }
/*!  box
================================================ */
.mod_inner01 { padding: 0 15px; }
@media screen and (min-width: 600px) { .mod_inner01 { width: 1100px; margin: 0 auto; padding: 0; } }
.mod_cv01 { background: url(../img/common/bg_01.png) center repeat; background-size: 75px; padding: 27px 0 40px; }
.mod_cv01 .tit { margin: 0 0 18px; }
.mod_cv01 .txt { color: #fff; margin: 0 0 15px; font-size: 1.1rem; }
@media screen and (max-width: 599px) { .mod_cv01 .txt { padding-right: 103px; position: relative; }  .mod_cv01 .txt:after { content: ""; display: block; background: url(../img/common/pic_cv01.png) left top no-repeat; background-size: contain; width: 105px; height: 124px; position: absolute; bottom: -15px; right: -2px; } }
.mod_cv01 .cv { background: #fff; padding: 15px; }
.mod_cv01 .cv .tel { margin: 0 0 15px; }
.mod_cv01 .cv .btn { line-height: 1.7; }
.mod_cv01 .cv .btn span { font-weight: 800; position: relative; z-index: 2; }
.mod_cv01 .cv .btn .small { display: block; text-align: center; font-size: 1.1rem; }
.mod_cv01 .cv .btn:before { content: ""; display: block; position: absolute; top: 0; bottom: 0; right: 10px; margin: auto; width: 63px; height: 48px; background: url(../img/common/ico_mail01.png) left center no-repeat; background-size: contain; z-index: 1; }
@media screen and (min-width: 600px) { .mod_cv01 { background-size: auto; padding: 70px 0 60px; }  .mod_cv01 .mod_inner01 { padding-right: 331px; position: relative; }  .mod_cv01 .mod_inner01:before { position: absolute; content: ""; bottom: -60px; right: -75px; background: url(../img/common/pic_cv01.png) left top no-repeat; background-size: contain; width: 461px; height: 610px; }  .mod_cv01 .tit { margin: 0 0 30px; }  .mod_cv01 .txt { color: #fff; margin: 0 0 30px; font-size: 1.7rem; }  .mod_cv01 .cv { padding: 0 40px 30px; width: 660px; }  .mod_cv01 .cv .tel a { pointer-events: none; cursor: auto; }  .mod_cv01 .cv .tel img { width: auto; margin: -33px 0 0; }  .mod_cv01 .cv .btn { font-size: 2.6rem; padding: 16px 0 15px; }  .mod_cv01 .cv .btn .small { font-size: 1.5rem; }  .mod_cv01 .cv .btn:before { right: 12px; width: 94px; height: 71px; }  .mod_cv01 .cv .btn:hover:before { background: url(../img/common/ico_mail01_on.png) left center no-repeat; background-size: contain; } }
/*!  mod_column01
================================================ */
.mod_column01 { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; text-align: center; }
.mod_column01 > * { width: 31%; padding: 20px 10px 18px; background-color: #333; box-sizing: border-box; }
.mod_column01 > * + * { margin-left: 3%; }
/*
#styleguide
mod_column01

三カラム

```
<p class="mod_column01">mod_column01</p>
```
*/
