@charset "utf-8";

/*----------------------------------------------------
　ground nav用
----------------------------------------------------*/
@media screen and (max-width: 1120px) {
	header{
/*		padding:20px 5%;*/
   /* 		padding:0;*/
	}
	header #siteName{
/*		left:40px;*/
	}
	header nav#gnav{    
/*		right:20px;*/
	}
	header nav#gnav > ul{
/*		padding-left:198px;*/
	}
	header nav#gnav ul li{
/*		padding:0 16px;*/
	}
    header nav#gnav ul li a{
        font-size: 20px;
    font-size: 2.0rem;}
}
@media screen and (max-width: 1020px) {
	header nav#gnav ul li.index{
/*		display:none;*/
	}
}

/*----------------------------------------------------
　Media Queries
 1000px以下用の記述
----------------------------------------------------*/
@media screen and (max-width: 1200px) {

	
	

	/*----------------------------
	共通要素のレイアウト
	----------------------------*/
	/* --- footer --- */
	footer .inner{
		width:90%;
	}
	#ftLink nav ul li{
		padding:0 16px;
	}
	/*----------------------------
	contents
	----------------------------*/
	.contents .inner{
		width:90%;
	}

	/* --- main --- */
	#main{
		width:67.3469387755102%;
	}
	#main section{
		margin-bottom:4em;
	}
	
	/*--- mainAbout ---*/
	#main #mainAbout .contentBox h2{
		margin:0 5% 0.5em;
		padding:0 0 0.6em;
	}
	#main #mainAbout .contentBox p{
		margin-bottom:5px;
		font-size:11px;
		font-size:1.1rem;
		line-height:1.4;
	}
	#main #mainAbout .contentBox p .f18{
		font-size:16px !important;
	}
	#main #mainAbout .contentBox p .mgn_r10{
		margin-right:0 !important;
	}
	#main #mainAbout .contentBox p > .number{
		display:block;
	}
	#main #mainAbout ul.linkArea li.mail{
		width:56.70731707317073%;
	}
	#main #mainAbout ul.linkArea li.access{
		width:13.41463414634146%;
	}
	
	#page .mail a,
	#page .mail a:link,
	#page .mail a:visited {
		width:100%;
		height:auto;
	}
	#page .mail a:hover,
	#page .mail a:active,
	#page .mail a:focus{
		background-size:100%;
	}
	#page .access a,
	#page .access a:link,
	#page .access a:visited {
		width:100%;
		height:auto;
	}
	#page .access a:hover,
	#page .access a:active,
	#page .access a:focus{
		background-size:100%;
	}
	
	
	/* --- side --- */
	#side{
		width:26.53061224489796%;
	}
	
	/* sideNav */
	#side .sideNav h2{
		text-align:left;
	}
	.sideNav h2 img{
		display:none;
	}
	.sideNav h2 span{
		display:inline-block;
		padding-left:5px;
		vertical-align:8%;
		line-height:1.2;
		font-size:14px;
		font-size:1.4rem;
		letter-spacing:0;
	}
	.sideNav nav ul li{
		line-height:1.2;
		font-size:14px;
		font-size:1.4rem;
	}
	
	/*----------------------------
	トップ
	----------------------------*/
	/* topNews */
	#main ul#tab-button{
		padding-right:10px;
	}
	#main ul#tab-button li{
		padding:0 16px;
	}
	
	
	
	/*----------------------------
	下層ページ
	----------------------------*/
	
	
	
}


/*----------------------------------------------------
　Media Queries
 767px以下用（タブレット／スマートフォン用）の記述
----------------------------------------------------*/
@media screen and (max-width: 768px) {

	body {
		font-size:14px;
		font-size:1.4rem;
	}

	/*----------------------------
	共通要素のレイアウト
	----------------------------*/	
	#index,
	.pageTitle{
		background-size:60%;
	}	
	.main section.prArea,
	.pageTitle h1{
		background-size:60%;
	}	
	/* meanmenu Customize */
	header,header #siteName,header div{
		display:inherit;
	}
	header div nav ul {
		max-width:100%;

	}
    header.indexhead > div{
	position:relative;
	max-width:1180px;
	margin:0 auto;
	height:60px;
}
header > div:not(header.indexhead > div){
	position:relative;
	max-width:1380px;
	margin:0 auto;
	height:60px;
}
	/* --- subnav --- */
/*	header div nav ul.sub-menu {
		opacity: 1;
	}*/
    header div nav ul.sub-menu {opacity: 1;}
header div nav ul.sub-menu li a {border-bottom:none;}
	/* --- パンくず --- */
	.main .path{
		width: 100%;
		max-width: 880px;
		margin:5px -10px;
		padding:0;
		font-size: 12px;
		overflow: hidden;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
	}
	/* --- mainVisual ---*/
	
	
	
	/*----------------------------
	トップ
	----------------------------*/
	
	
	/*----------------------------
	下層ページ
	----------------------------*/
	
	
}



/*----------------------------------------------------
 　Media Queries
  670px以下用（スマートフォン用）の記述
----------------------------------------------------*/
@media screen and (max-width: 670px){

	/*----------------------------
	共通要素のレイアウト
	----------------------------*/

	/*----------------------------
	山形村共通
	----------------------------*/
	.sideNav nav ul li:last-child{
		border-bottom:2px solid #d9d3ce
	}
	
	/*----------------------------
	contents
	----------------------------*/
	.contents{
		margin-bottom:3em;
	}
	
	#main,
	#side{
		float:none;
		width:100%;
	}
	
	/* --- pagetop --- */
	.pagetop {
		width: 40px;
		height: 40px;
		right:10px !important;
	}
	
	/* --- main --- */
	
	
	
	/* --- side --- */
	#side section{
		overflow:hidden;
	}
	/* .sideNav */
	.sideNav{
		width:49%;
		padding:13px 10px 15px;
	}
	.sideNav:nth-child(odd){
		clear:both;
		float:left;
	}
	.sideNav:nth-child(even){
		float:right;
	}
	.sideNav h2 span{
		font-size:12px;
		font-size:1.2rem;
	}
	.sideNav nav ul li{
		font-size:12px;
		font-size:1.2rem;
	}
	.sideNav nav ul li a{
		padding:9px 10px 9px 0;
	}
	#side .bnr{
		width:100%;
		margin:20px auto 0;
		text-align:center;
	}
	/* --- footer --- */
	#ftAdd .inner,
	#ftAdd .contentBox,
	#ftAdd .mail{
		display:block;
	}
	#ftAdd .contentBox{
		margin-bottom:1em;
	}
	#ftAdd .contentBox dl dd .number{
		display:table-cell;
		margin:0;
		padding-right:10px;
	}
	#ftAdd a[href^="tel:"]{
		margin:0;
	}
		
	/*----------------------------
	トップ
	----------------------------*/
	/* --- mainVisual ---*/
	#mainVisual{
		max-height:450px;
	}
	#mainVisual .caption p{
		width:50%;
		height:auto;
		bottom:37%;
	}
	#mainVisual .caption div{
		width:50%;
		bottom:20%;
	}
	


	
}
@media screen and (max-width: 490px){
	/*----------------------------
	共通要素のレイアウト
	----------------------------*/
	.sp{
		display:block;
	}
	
	/*----------------------------
	共通要素のレイアウト
	----------------------------*/
	header > div{
		height:60px;
	}
	header #siteName{
		top:15px;
		left:20px;
	}
/*	header #siteName img{
		height:30px;
		width:auto;
	}*/
	
	/* --- footer --- */
	#ftLink{
		padding:30px 0 20px;
	}
	#ftLink nav ul{
		margin-bottom:10px;
	}
	#ftLink nav ul li{
		margin-bottom:10px;
	}
	#ftLink .bnr ul{
		width:100%;
	}
	#ftLink .bnr ul li{
		width:49%;
		margin:0 0 2% 0;
		padding:0 1%;
	}
	
	#ftAdd{
		padding:20px 0;
	}
	
	/*----------------------------
	contents
	----------------------------*/
	.contents{
		padding-top:0px;
	}
	/* --- pageTitle --- */
	#pageTitle{
		margin-bottom:2em;
		padding:50px 5% 20px;
	}
	#pageTitle h1{
		margin-bottom:15px;
		font-size:24px;
		font-size:2.4rem;
	}
	#main section{
		margin-bottom:3em;
	}
	/* --- 見出し --- */
	.contents #main .section-title h2{
		padding:0 0.9em;
	}
	.contents #main .section-title h2 .en{
		font-size:12px;
		font-size:1.2rem;
	}
	.contents #main .section-title h2 img{
		display:none;
	}
	
	.contents #main h2{
		padding:0 0.9em;
		font-size:20px;
		font-size:2.0rem;
	}
	
	#main h3{
		font-size:18px;
		font-size:1.8rem;
	}
	#main h4 {
		font-size:16px;
		font-size:1.6rem;
	}
	#main h5 {
		font-size:14px;
		font-size:1.4rem;
	}
	/* --- pageList --- */
	.pageList {
		position: relative;
		padding-bottom: 50px;
	}
	.pageList .prev {
		position: absolute;
		top: 50px;
		left: 10px;
	}
	.pageList .next {
		position: absolute;
		top: 50px;
		right: 10px;
	}
	/* --- テーブル --- */
	.main table th,
	.main table td {
		padding-left: 10px;
		white-space:normal;
		padding-right: 10px;
	}
    .img_l {
		float:none;
		margin:0 auto 10px;
		text-align:center;
    }
    .img_r {
		float:none;
		margin:0 auto 10px;
		text-align:center;
    }
    .float_l {
		float: none;
    }
    .float_r {
		float: none;
    }
	.main a.btn,
    .main a.btn:link,
    .main a.btn:visited {
	    margin-bottom:1em;
    }
    .pageTitle h1{
    	padding:30px 10px;
    	text-align:center;
    }
	/* --- 2カラム --- */
    .layout-2col .contentBox{
		width:100%;
		float:none;
		margin:0 auto 20px;
		position:relative;
	}
    .layout-2col .contentBox:nth-child(even){
		margin:0 auto;
	}	
	/* --- 3カラム --- */
	.layout-3col-top .contentBox,
	.layout-3col .contentBox{
		width:49.48%;
		float:left;
		margin:0 1.02% 10px 0;
		position:relative;
	}
	.layout-3col-top .contentBox:nth-child(2n),
	.layout-3col .contentBox:nth-child(2n){
		margin:0 0 10px 0;
	}
	.layout-3col-top .contentBox:nth-child(3),
	.layout-3col .contentBox:nth-child(3),
	.layout-3col .contentBox:nth-child(9),
	.layout-3col .contentBox:nth-child(15){
		margin:0 1.02% 10px 0;
	}
	
	
	/* --- main --- */
	
	
	/* --- mainAbout ---*/
	#mainAbout{
		display:block;
	}
	#mainAbout .contentBox{
		display:block;
		width:100%;
		max-width:328px !important;
		margin:0 auto;
		border:none !important;
	}
	#main #mainAbout .contentBox h2{
		margin: 0 0 0.7em;
    	padding: 1.1em 0 0.8em;
		text-align:center;
	}
	#main #mainAbout .contentBox h2 img{
		display:inline;
	}
	#main #mainAbout .contentBox p {
		margin-bottom: 10px;
		font-size: 12px;
		font-size: 1.2rem;
		line-height: 1.8;
	}
	#main #mainAbout .contentBox p > .number{
		display:inline;
	}
	#main #mainAbout .contentBox p .f18{
		font-size: 18px !important;
	}
	#main #mainAbout .contentBox p .mgn_r10{
		margin-right: 10px !important;
	}
	#main #mainAbout ul.linkArea{
		padding-bottom:2.3em;
	}
	#main #mainAbout ul.linkArea li.mail,
	#main #mainAbout ul.linkArea li.access{
		width:auto;
	}
	
	/*----------------------------
	トップ
	----------------------------*/
	/* --- mainVisual ---*/
	#mainVisual{
		max-height:350px;
	}
	
	/* --- topNews ---*/
	.tab-select-outer{
		margin-bottom:1em;
		text-align:center;
	}
	#tab-select {
	  /* removes default appearance of select */
	  -webkit-appearance: none;
	  -moz-appearance: none;
	  appearance: none;
	
	  padding: .5em 22px .5em .5em;
	  border-radius: 4px;
	  background-position: right;
	  background-repeat: no-repeat;
	  border:1px solid #666;
	
	  /* adds triangle image as a background  */
	  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="5"><path d="M0,0 10,0 5,5z" fill="black" /></svg>');
	}
	
	#tab-select[disabled] {
	  /* same image but gray */
	  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="5"><path d="M0,0 10,0 5,5z" fill="gray" /></svg>');
	}
	
	
	#newsArea .tab-contents ul li{
		display:block;
	}
	#newsArea .tab-contents ul li a,
	#newsArea .tab-contents ul li a:link,
	#newsArea .tab-contents ul li a:visited {
		padding:12px 0;
	}
	#newsArea .tab-contents ul li a time{
		width:6.5em;
	}
	#newsArea .tab-contents ul li a .tab-name span{
		width:7em;
	    padding: 5px 0 6px;
	}
	#newsArea .tab-contents ul li a p.blogTitle{
		display:block;
		margin:8px 0 0 0;
	}
	/*------------------------
	お知らせ・スタッフブログ
	-------------------------*/
	.entry_meta p {
		display: block;
	}
	.entry_meta .category {
		margin-left: 0;
		margin-top: 5px;
	}
	
	/*------------------------
	about
	-------------------------*/
	/* --- メリット ---*/
	#main .merit table td{
		padding:20px 0 5px 18px;
		vertical-align:middle;
		line-height:1.2;
		letter-spacing:0;
		background: url(/yamagata/images/check-mark.png) left center no-repeat;
		background-size:12px;
	}
	#main .merit table img{
		display:none;
	}
	#main .merit table strong{
		font-size:16px;
		font-size:1.6rem;
	}
	
}