@charset "UTF-8";
@media screen and (max-width:1299px) {
	.containar { width:100%; height:100%; margin:0 auto; position:relative; }
	#main_contents { width:96%; float:none; margin:50px auto 0; }
	footer .footer_menu .containar { width: 100%;}
}

@media screen and (max-width:768px) {
/* ===================================================================

	Setting

=================================================================== */
html { color:#333; background:#FFF; line-height:1.6; text-align:left; font-size:65.5%; }
body { font-size:1.5rem; font-family:'メイリオ',Meiryo,'ＭＳ Ｐゴシック','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro'; overflow-x:hidden; }
img { max-width:100%; height:auto; }
main { padding-top:60px; }
.containar { width:100%; height:100%; margin:0 auto; position:relative; }
.containar:after { content:""; display:block; clear:both; }


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


　　/* link set
	------------------------------------------------------------------- */
	a { color:#5B463F; text-decoration:none; transition:0.3s ease-in-out; }
	a img { transition:0.3s ease-in-out; }
	a:hover { color:#47676F; }

	.b_p {
    font-size: 14px;
		width: 80%;
		margin:0.5em;
		}
	.blue button {
    width: 80%;
		}
	.blue {
    text-align: center;
		}
	.pink {
		max-width:unset;
		text-align:center;
	}


	.pink button {
	  width: 75%;
	  letter-spacing: 1px;
		}

	/* float対策：背景色表示用
	------------------------------------------------------------------- */
	.clearfix:after { display: block; clear: both; height: 0px; line-height: 0px; visibility: hidden; content: "."; }
	.clearfix {	display: block; /* for IE8 */ }
	.both { clear:both; }
	.hidden { display: none; }

	/* 	imgホバーアクション
	------------------------------------------------------------------- */
	.imgWrap { overflow: hidden; width: 100%;　height: auto; cursor: pointer; background-color: #ffffff; }
	.imgWrap img{ display: block; transition-duration: 0.3s; margin-top: -1px; }
	/*.imgWrap img:hover{ opacity: 0.6; transform: scale(1.1); transition-duration: 0.3s; }*/

	/* 	背景画像＆テキスト使用時スマホ用
	------------------------------------------------------------------- */
	.bg.spTxt { text-indent: 0; width: auto !important; height: auto !important; background-image: none !important; }



/* ===================================================================

	Header

=================================================================== */
body > header  { height:60px; position:fixed; }

	      /* h_l
		  ------------------------------------------------------------------- */
		  body > header .h_l { float:none; }
		  body > header .h_l img { margin-top:2%; width:230px; }

.header_submenu { display:none; }

/* ===================================================================
	/
	/	smh_menu　トグルメニュー
	/
	=================================================================== */
	#smh_menu { display: block; position: relative;	z-index: 9999; }
	.drawer-nav ul li { margin-right: 0px; float: none; font-size: 1.1rem; display: block;	padding:.75rem;	text-decoration: none;	color: #fff; }
	.drawer-nav ul ul.drawer_sub li a { color: #fff; }
	body > header nav { display:none; }



/* ===================================================================
	/
	/	nav
	/
	===================================================================
	body > header nav { display:none; }
	body nav { display:block; }*/
	/* btm nav
	body nav { position:fixed; left:0; bottom:-1px; width:100%; background:#FFF; border-top:1px solid #CCC; z-index:9999; font-size:1.2rem; }
	body nav > ul:after { content:""; display:block; clear:both; }
	body nav > ul li { float:left; width:20%; text-align:center; font-size:10px; }
	body nav > ul li a { display:block; width:100%; color:#666; padding:4em 0 .5em; position:relative; background-position:center top 1em; background-repeat:no-repeat; font-weight:bold; }*/



/* ===================================================================
	/
	/	共通
	/
	=================================================================== */



/* ===================================================================
	/
	/	メインイメージ
	/
	=================================================================== */
	.main_img { height:300px; position:relative; background-image:url(../images/top_mainimg_sp.jpg); background-repeat:no-repeat; background-size:cover; }

	.main_img .main_h1 { position:relative; width:85%; padding:30px 0; margin:0 auto; left:0; top: 60px; opacity:0.8; }
	.main_img .main_h1 h1 { line-height:35px; font-size:1.2rem; letter-spacing:3px; margin-bottom:20px; padding:0 5%; }
	.main_img .main_h1 p { line-height:25px; padding:10px 0; }


/* ===================================================================
	/
	/	s1
	/
	=================================================================== */
	.s1 { padding:30px 0; }
	.s1 .containar h2 { text-align:center; font-size:2rem; color:#fff; font-weight:bold; margin-bottom:10px; letter-spacing:5px; }
	.s1 .containar p { font-size:1.2rem; width:100%; float:none; margin:0 auto; line-height:25px; padding:0 5%; }
	.s1 .containar .btn { padding-top:5%; text-align:center; }
	.s1 .containar .btn img { float:none; }




/* ===================================================================
	/
	/	s2
	/
	=================================================================== */
	.s2 { padding:30px 0; margin-bottom:50px; }
	.s2 .containar img { width:100%; }
	.s2 .containar h3 { font-size:1.5rem; padding:10px 0; }
	.s2 .containar p {font-size:1.2rem; line-height:25px; width:90%; margin:0 auto; }


/* ===================================================================
	/
	/	s3
	/
	=================================================================== */
	.s3 { padding-bottom:30px; }
	.s3 .l { width:100%; float:none; }
	.s3 .r { width:100%; float:none; }
	.s3 .r p { font-size:1.2rem; line-height:25px; padding:5%; }
	.s3 .r ul { padding:0 5%;  }
	.s3 .r ul li { width:48%; font-size:1.1rem; padding:10px 10px 10px 25px; margin-right:2%; margin-bottom:2%; background-position:10px 14px; }
	.s3 .r ul li:nth-child(3) { width:48%; }
	.s3 .r ul li a { text-decoration:none; color:#fff; }



/* ===================================================================
	/
	/	news
	/
	=================================================================== */
	.news { padding:30px 5%; }
	.news .containar h2 { font-size:2rem; text-align:left; }
	.news .containar h2 span.r { padding-right:0; }

	.news .containar ul { width:100%; margin:0 auto; }


/* ===================================================================
	/
	/	office
	/
	=================================================================== */
	.office { padding:30px 0; }
	.office .containar h2 { font-size:2rem; }
	.office .containar .office_box { width:90%; float:none; margin:2% auto;  }
	.office .containar .office_box h3 { font-size:1.2rem; font-weight:bold; border-left:solid 3px #8dd05a; padding-top:3%; padding-left:2%; margin:0 5% 2% 5%;}
	.office .containar .office_box p { font-size:1rem; margin:0 5% 3% 7%; line-height:16px; }
	.office .containar .office_box .office_info { width:100%; float:none; }
	.office .containar .office_box .office_map { width:100%; float:none; }
	.office .containar .office_box .office_map iframe { padding:0 5%; height:120px; }

	#office { padding-top:60px; margin-top:-60px; }


/* ===================================================================
	/
	/	footer
	/
	=================================================================== */
	footer { padding-top:30px; }
	footer .footer_menu { margin-bottom:30px; }
	footer .footer_menu .containar { width:100%; }
	footer .footer_menu .l { width:60%; float:none; margin:0 auto 30px;; }
	footer .footer_menu .r { width:100%; float:none; }
	footer .footer_menu .r .footer_menu_box { width:80%; float:none; border-left:none; min-height:auto; padding:0; margin:0 auto 20px; }
	footer .footer_menu .r .no_border { border-left:none; }
	footer .footer_menu .r .footer_menu_box h3 { font-size:1.3rem; font-weight:bold; margin-bottom:10px;}
	footer .footer_menu .r .footer_menu_box ul { padding-left:10%; }
	footer .footer_menu .r .footer_menu_box ul li { font-size:1.1rem; margin-bottom:3%; }
	footer .footer_menu .r .footer_menu_box p { font-size:1.1rem; margin-top:5%; }

	footer .copyright { background-color:#6cbc4f; padding:1% 0; text-align:center; }
	footer .copyright p { font-size: 0.7rem; color:#fff; text-align:center; margin:0; line-height:20px; }

	footer .footer_contact { padding:10px 0 0; }
	footer .footer_contact p { font-size:1.3rem; line-height: 25px; }
	footer .footer_contact .l { width:100%; float:none; padding-left:0; margin-bottom:0; }
	footer .footer_contact .l p { font-size:1.2rem; margin-bottom:5%; }
	footer .footer_contact .l a { text-decoration:none; color:#fff; margin-right:0;}
	footer .footer_contact .l span { font-size:1.2rem; }
	footer .footer_contact .l img { margin-right:2%; margin-bottom:3%; }
	footer .footer_contact .r { width:100%; float:none; margin:0 auto; }
	footer .footer_contact .r .mail_btn { margin:0; background-position:30px 20px; font-size:1.2rem; width:100%; }


}