@charset "UTF-8";


/* スマホ用 */
@media screen and (max-width:1023px) {
/* ===================================================================

	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; }
.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; }

	/* 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 {
	width: 100%;
	height: 90px;
	z-index: 1;
}
body > header .logo {
	line-height: 1.8;
	display: inline-block;
	width: 80%;
}

	@media screen and (min-width:768px) and (max-width:1023px) {
		body > header .logo {
			width: 45%;
		}
	}
	
	
body > header h1 {
	width: 100%;
	margin-top: 0px;
	padding-left:2%;
	font-size:10px;
}
body > header img.logo02 {
	width: 60%;
	margin-left: 1%;
	vertical-align: bottom;
}
body > header .h_tel {
	position: absolute;
	top: 0;
	right: 1%;
}
body > header .h_tel img {
	width: 55%;
}
body > header .logo {
	float: left;
	padding: 10px 0px 0px 0px;
	margin-right: 100px;
}
.header_menu { padding-top:0; }
body > header .h_l {padding: 10px 0; width: 100%;}
body > header .h_l a img { width:270px; margin:0 0 0 10px; }

/* h_r
		  ------------------------------------------------------------------- */
body > header .h_r {
	display: none;
}
/* nav
		  ------------------------------------------------------------------- */
body > header nav {
	display: none;
}
/* smh_menu
		  ------------------------------------------------------------------- */
#smh_menu {
	display: none;
}


.header_contact { 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: #222; }


/* ===================================================================
	/
	/	news
	/
	=================================================================== */
	.news {	padding: 30px 0; background: none; border-bottom: 2px solid #18223D;}
	.news .containar h2 { float: none; margin: 3px auto; }
	.topix .topix_left a { color: #18223D;}
	.topix .topix_left { float:none; width:100%; text-align:center; border:none; padding:0; height:80px; background: none;}
	.topix .topix_right { float: none; margin:0 20px; height:auto; text-align:center; }
	.topix .topix_right ul li {	line-height:25px; font-size:15px; text-align: left; margin-bottom: 10px; padding-left:45px; }
	.topix .topix_right ul { padding:10px 0; }
	.topix .topix_right ul li a p { line-height:25px; }
/* ===================================================================
	/
	/	campain
	/
	=================================================================== */
	.cam_area{
    width: 86%;
    padding-top: 5px;}
	
	
	.cam_area dl {
    width: 100%;
	}
	.cam_area .e_back {
		width: auto;
		padding: 0.5em;
		border-radius: 10px;
		margin-bottom: 40px;
	}
	.cam_area .event-txt {
		font-size: 12px;
	}

/* ===================================================================
	/
	/	main image
	/
	=================================================================== */
	#main_img{ display:block;
		height:780px;
		margin-top: -25px;
	}
	
	.maintext{
		
	}
	.maintext h1{
		margin-bottom: 25px;
        font-size: 0.8em;
		font-weight:600;
		letter-spacing:0.3em;

	}
	.maintext p{
		line-height: 2;
        letter-spacing: 0.2em;
    	margin-bottom: 10px;
		font-size:1.2rem;

	}
	.maintext img{
		width:96%;
		margin: 30px auto 0;

	}
	.maintext .btn_link {
		min-width:220px;
		padding:15px 30px;
	}

	.top_text p { font-size:12px; text-align:left; padding:2px 10px; }


/* ===================================================================
	/
	/	ボタン
	/
	=================================================================== */
	.btn_link {
    color: #4e4c4c;
    font-weight: 600;
    font-size: 13px;
    text-align: center;
    display: inline-block;
    padding: 15px 30px;
    margin: 0;
    min-width: 300px;
    position: relative;
    /*border: 2px solid #4e4c4c;*/
	border-radius: 7px;
	background: #fff;
    background-image: url(../images/link_arow.png);
    background-repeat: no-repeat;
    background-position: 95% 50%;
	}
	.btn_link:hover {
		color: #fff;
		background: #191919;
		background-image: url(../images/link_arow2.png);
		background-repeat: no-repeat;
		background-position: 95% 50%;
	}

/* ===================================================================
	/
	/	共通
	/
	=================================================================== */
	.containar { width: 100%; max-width: 1350px; margin: 0px auto; }
	.containar h2{font-size: 1.5em; letter-spacing: 2px;}
	.containar h3{font-size: 1em; letter-spacing: 2px;}
	.containar p{line-height: 25px; letter-spacing: 1px; font-size: 0.8em;color: #18223D;}
	.containar .f_box { display:block;}
	.containar .f_box .inbox { width:90%; margin:0 auto 40px; }
	.containar .f_box .inbox h3 { margin-bottom: 10px; text-align: left; color: #18223D; font-weight: 600;}
	.containar .f_box .inbox p { margin-bottom: 20px; text-align: left;}

	.containar .f_box .btn_link02 {
		font-size:13px;
	}

/* ===================================================================
	/
	/	s_bnr
	/
	=================================================================== */
	.s_bnr{ padding: 20px 0;}	
	.sdgs{ max-width: 100%; width: 90%;}
	
	
	/* ===================================================================
	/
	/	s1
	/
	=================================================================== */
	.s1 { padding: 30px 0 40px; }
	.s1 .containar h2{margin-bottom:10px; font-size: 1.3em; letter-spacing: 1px; margin-top: 10px; }




/* ===================================================================
	/
	/	s2
	/
	=================================================================== */
	.s2 {
    margin-bottom: 193px;
}

	.s2 .kaitori_jirei { width:90%; }
	.s2 .kaitori_jirei h2 { font-size: 1.3em; letter-spacing: 1px; margin-bottom:20px; }
	.s2 .kaitori_jirei .jirei_area { display:block; }
	.s2 .kaitori_jirei .jirei_box { width:100%; }
	.s2 .kaitori_jirei .jirei_box dd { font-size:12px; }	
	.s2 .kaitori_jirei .btn_link { margin:20px auto; }

/* ===================================================================
	/
	/	contact_area
	/
	=================================================================== */
	.contact_area { padding:30px 0; }
	.contact_area .containar { width:80%; }
	.contact_area .btn_link { min-width: 250px; }

	.contact_area p { color:#fff; }



/* ===================================================================
	/
	/	bailaor
	/
	=================================================================== */
	.bailaor { padding:30px 0px; }
	.bailaor .waku { display:block; padding:20px; width: 95%; margin: 0 auto; }
	.bailaor .waku div { margin:0 auto 10px; text-align:center;  }
	.bailaor .waku div img.emblem { width:100px; }


/* ===================================================================
	/
	/	footer
	/
	=================================================================== */
	footer { padding: 0; text-align:center; }
	footer .containar .footer_area { padding: 0 3vw; display:block; }
	footer .containar .footer_area .area01 { width:100%; padding:0; display: block; padding: 12px 0;}
	footer .containar .footer_area .area01 .area01_flex { display:block; }
	footer .containar .footer_area .area01 .f_img_area { margin:30px 0; height:auto; -ms-flex-wrap: wrap; flex-wrap: wrap; }
	footer .containar .footer_area .area01 .f_img_area a img { width:100%; margin-bottom:15px; }
	footer .containar .footer_area .area01 .f_img_area_2 { display:block; height:auto; display:none; }
	footer .containar .footer_area .area01 .f_img_area_2 img { margin-bottom:10px; width:45%; }
	footer .containar .footer_area .area01 p {  font-size: 1rem;}

	footer .containar .footer_area .area01 p.unit { margin:0; text-align: left;}
	
	footer .f_box  { display: block;}
	footer .f_box .box_hokan { width: 100%; padding: 25px;}	
	footer .f_box .box_kaitori { width: 100%; padding: 25px;}

	.copyright small { font-size:12px; }





}
@media screen and (min-width:500px) and (max-width:768px) {
		#main_img{ height:630px; }
	}
	@media screen and (min-width:300px) and (max-width:499px) {
		#main_img{ height:400px; }
	}