
/*===============================================
　画面の横幅が480pxまで▼▼▼▼▼
===============================================*/

@media screen and (max-width:761px){


	html, body {
		height: 100% !important;
		/* iPhone 6,7,8,x を基準に */
		font-size: calc(100vw / 37.5);
	}
	

	article p {
		margin: 0;
		padding: 0;
		font-size: 1.4rem;
		line-height: 160%;
	}
	
	
	.bg{
		background: url("../img/bg_main_sp.jpg") no-repeat;
		background-size: 700%;
		background-position: center calc(100vw*-0.8);
	}
	
	
	/* =========================================================================
 	common BTN
	===========================================================================*/
	
	
	/* event BTN s ---------------------------------------------- */
	
	.event_BTN_area{
		margin: 20px 5% 52px;
		font-family: "Noto Sans Japanese";
		color: #ffffff;
	}
	
	.event_BTN_area li.event_BTN{
		width: 100%;
		background: url("../img/bg_black2.gif") repeat;
		border:2px solid #000;
		cursor:pointer;
		overflow: hidden;
		position: relative;
		margin: 0 0 4px;
	}
	
	
	.event_BTN_area li.event_BTN a{
		display: block;
		width:100%;
		padding: 10px 0;
		color: #ffffff;
		background: url("../img/arrow_white.png") no-repeat 97% center;
		background-size: 12px auto;
		position: relative;
		z-index: 4;
	}
	
	.event_BTN_area li.event_BTN a.inPhoto img{
		position: absolute;
		width: 100%;
		top: -230px;
		left: 0;
		z-index: 1;
	}
	
	.event_BTN_area li.event_BTN a.inPhoto{
		margin: 220px 0 0;
	}
	
	.event_BTN_area .event_ttl{
		border-left: 5px solid #7cbd60;
		padding: 5px 0 6px 16px;
		margin: 0 0 0 10px;
	}
	
	.event_BTN_area  h3{
		font-family: "Noto Sans Japanese";
		font-weight: 500;
		font-size: 2.0rem;
	}
	
	.event_BTN_area .event_ttl p.place{
		font-family: "Noto Sans Japanese";
		font-weight: 300;
		font-size: 1.2rem;
		line-height: 130%;
	}
	
	.event_BTN_area div.event_ttl p.add_list{
		font-family: "Noto Sans Japanese";
		font-weight: 200;
		font-size: 1.2rem;
		padding: 20px 40px 0 0;
		text-indent: -8px;
		line-height: 140%;
	}
	
	.event_agenda{
		/* padding: 11px 36px 0 0px; */
		position: absolute;
		top: 5px;
		right: 25px;
	}
	
	.event_agenda p{
		font-size: 3.0rem;
		font-family: "Noto Sans Japanese";
		font-weight: 400;
		letter-spacing: -1px;
	}
	
	.event_agenda p span{
		font-size: 1.4rem;
		font-weight: 200;
		margin: 0 0 0 4px;
	}
	
	
	
	/* event BTN e ---------------------------------------------- */
	
	/* reserv BTN s ---------------------------------------------- */
	
	.reserv_BTN a{
		position: relative;
		overflow: hidden;
		display: block;
		width: 100%;
		margin: 0 auto 30px;
		color: #ffffff;
		font-family: "Noto Sans Japanese";
		font-size: 1.8rem;
		text-align: center;
		font-weight: 400;
		padding: 22px 0;
		background:#6eb332 url("../img/arrow_white2.png") no-repeat 97% center;
		background-size: 22px auto;
		border: solid 2px #2a2a2a;
	}
	
	
	/* reserv BTN e ---------------------------------------------- */
	
	
	/*********  main ************/

    #back{
    	background: url("../img/top.jpeg") top;
    	background-size: 100%;
    	min-height: 130px;
    }

    #back_close{
/*    	background: url("../img/top.jpeg") top; */
    	background-size: 100%;
    	min-height: 130px;
    }

	#sec_main_wrap{
		font-family: "Noto Sans Japanese";
		width: 100%;
		margin: -40px 0 0;
		/* position: absolute; */
	}

    #sec_main_wrap .close_msg{
    	width: 95%;
		font-family: "Noto Sans Japanese";
		margin: 80px auto;
		font-size: 20px;
		text-align: center;
    }


	#sec_main_wrap02{
		color:#509432;
		width: 1000px;
		position: relative;
		margin: 92px 3% -10px;
	}
	
    #rec_ttl{
    	left: 0;
    }

	.ttl_gre{
		background-color: #509432;
		padding: 4px 2px 4px 12px;
		color: #fff;
		font-size: calc(100vw / 37.5*1.2);
	}
	
    .ttl_box{
    	margin: 2px 0 0px;
    	text-shadow: white 1px 1px 0px, white -1px 1px 0px, white 1px -1px 0px, white -1px -1px 0px;
    }

	h1{
		font-size: calc(100vw / 37.5*3.8);
		float: left;
		font-weight: bold;
	}

    .navi{
        font-size: calc(100vw / 37.5*1.9);
        margin: 8px 1% 0;
        display: inline-block;
    }

    .subttl{
    	margin: 0px 0 0px 13%;
    	font-size: calc(100vw / 37.5*1.2);
    	display: block;
    }

    /*********  event ************/

    #event_box{
    	width: 94%;
    	position: relative;
    	margin: -11px auto 24px;
    	font-family: "Noto Sans Japanese";
    }

	#event_box .event_ttl{
        width: 100%;
        background-color: #6eb92b;
        padding: 8px 2px 2px 2px;;
        margin: -79px 0 -4px 0;
 }

	#event_box h2{
		color: #fff;
		/* text-align: center; */
		font-weight: 400;
		font-size: calc(100vw / 37.5*1.8);
		margin: 0 auto 6px;
	}

    #event_box .fair:nth-child(1){
    	background-color: #fff;
    	padding: 15px 20px;
    	border-bottom: 2px #6eb92b solid;
    }

    #event_box .fair:last-child{
    	background-color: #fff;
    	padding: 5% 4% 4%;
    }

    #event_box .fair:hover{
		transition: all 0.5s ease 0s;
		opacity: 0.9;
		color: #313131;
	}

    #event_box .fair h3{
    	font-size: calc(100vw / 37.5*2.0);
    	color: #6f59a8;
    	font-weight:500;
    	line-height: 20px;
    	float: none;
    	margin: -21px 10px 0 0;
    }

    #event_box .fair2 h3{
    	color: #6eb92b;
    	font-size: calc(100vw / 36.5*1.6);
    	margin: -1px 10px 0 0;
    }

    #event_box .fair h3 span{
     	font-size: calc(100vw / 37.5*1.4);
     	display: block;
     	font-weight:300;
    }

    #event_box .fair2 h3 span{
    	font-size: 11px;
    	display: block;
    	line-height: 14px;
    	left: -16px;
    	position: relative;
    }

    #event_box .fair .place{
     	margin: 4px 0px -4px;
    }

    #event_box .fair2 .place{
     	margin: 8px 0px -19px;
     	color: #6eb92b;
     	display: flex;
     	justify-content: space-between;
    }

    #event_box .fair2 .place .l_box{
		width: 48%;
		text-align: center;
    }

    #event_box .fair2 .place .r_box{
		width: 48%;
		text-align: center;
    }

     #event_box h4{
     	background-color: #6eb92b;
     	width: 98%;
     	height: 15px;
     	display: inline-block;
     	color: #fff;
     	text-align: center;
     	font-weight: 200;
     	margin: 0 0 6px;
     }

    #event_box .fair .here{
     	text-align: center;
     	width: 100%;
     	margin: 5px auto 0;
     	font-size: calc(100vw / 37.5*1.3);
     	background-color: #eee;
     	padding: 0 0 2px;
     	position: relative;
     	color: #797e79;
     	letter-spacing: 0;
     	font-weight: 200;
    }

    #event_box .fair .here:before{
		content: "　";
		width: 6px;
		height: 6px;
		border-top: 1px solid #acacac;
		border-right: 1px solid #acacac;
		position: absolute;
		top: 35%;
		left: 71%;
		-webkit-transform:translate(-50%, -50%); /* iOS8以下やAndroid4.4.4以下対応時のみ */
		transform:translate(-50%, -50%);
		transform: rotate(45deg);
	}

    #event_box .fair .place p{
    	font-size: calc(100vw / 37.5*2.8);
    	font-family: 'Roboto', sans-serif;
    	font-weight: 400;
    	color: #6f59a8;
    	margin: -10px 0 13px;
    }

    #event_box .fair2 .place p{
    	font-size: calc(100vw / 37.5*2.2);
    	font-family: 'Roboto', sans-serif;
    	font-weight: 400;
    	color: #6eb92b;
    	letter-spacing: -0.05em;
    }

    #event_box .fair .place p span{
    	background-color: #6f59a8;
    	font-size: calc(100vw / 37.5*1.2);
    	color: #fff;
    	position:relative;
    	top: -2px;
    	margin: 0 1px;
    	padding: 1px 1px 1px 3px;
    	border-radius: 50%;
    }

    #event_box .fair2 .place p span{
    	background-color: #6eb92b;
    	font-size: calc(100vw / 37.5*1.2);
    	color: #fff;
    	position:relative;
    	top: -2px;
    	margin: 0 0 0 4px;
    	padding: 1px 4px 1px 3px;
    	border-radius: 50%;
    }

    #event_box .sponsor{
    	font-size: calc(100vw / 37.5*1.2);
    	color: #797e79;
    	text-align: center;
    	letter-spacing: 0.0em;
    }

    

    /*********  adv ************/
    
    .adv{
    	width: 100%;
/*    	background-color: rgba(198,255,247,0.8); */
/*    	margin: 86px 0 0px; */
    	margin: 20px 0 0px;
/*    	height: 385px; */
    	height: 200px;
    }

    .adv_wrap{
    	margin: 0 auto;
    	width: 100%;
    	/* display: flex; */
    	/* justify-content: space-between; */
    	padding: 22px 0 0px;
    }

    .adv_wrap li{
    	margin: 9px auto;
    	text-align: center;
    }

    .adv img{
    	width: 94%;
    }

    .adv img:hover{
		transition: all 0.5s ease 0s;
		opacity: 0.9;
	}

	/*********  rec_under_wrap ************/

    #rec_under_wrap{
    	/* background-color: #eafce2; */
/*    	margin: 80px 0 0 0; */
		margin: 20px 0 0 0;
    }

    #white_wrap{
    	background-color: #ffffff;
    	width: 100%;
    	margin: 0px auto 0;
    	padding: 31px 0 42px;
    } 

	#white_wrap .information{
		width: 90%;
		margin: 0px auto 40px auto;
		font-family: "Noto Sans Japanese";
		font-size: 15px
	}

    /*********  section01 ************/
	
	#sec01{
        font-family: "Noto Sans Japanese";
        width: 93%;
        margin: 0 auto;
 }

	#sec01 .wrapper{
		float:left;
		/* width: 90%; */
	}

	.search{
		margin: 6px 0 48px;
	}

    #sec01 h2{
    	font-size: calc(100vw / 37.5*1.8);
    	font-family: "Noto Sans Japanese";
    	margin: 0 0 9px;
    }

    #sec01 h2 span{
    	font-size: calc(100vw / 37.5*1.4);
    }

    #sec01 h2:before{
    	display: inline-block;
    	content:"";
    	width: 3px;
    	height: 22px;
    	background-color: #000;
    	color: #000;
    	margin: 0 12px -2px 0;
    }
	
	
	#news_box{
		/* padding: 0 50px 0 0; */
	}
	#news_box li {
		font-family: "Noto Sans Japanese";
		border-bottom: 1px solid #e3e3e3;
		margin-bottom: 14px;
		padding: 0 0 18px;
	}

	#news_box li:first-child{
		border-top: 1px solid #e3e3e3;
		padding: 18px 0 18px;
	}
	#news_box li p.day {
		font-weight: 600;
		/* float: left; */
		/* width: 90px; */
		color: #6eb92b;
		padding: 0 0 6px;
		font-size: 12px;
	}
	#news_box li p.news {
		font-weight: 200;
		/* float: left; */
		/* width: 470px; */
		line-height: 140%;
		text-decoration: none !important;
	}
	#news_box li a p.news{
		text-decoration: underline;
	}
	#news_box li a {
		display: block;
	}
	#news_box li a:hover {
		transition: all 0.5s ease 0s;
		opacity: 0.5;
	}
	a#more_news_btn {
		display: block;
		width: 74%;
		background: #6eb92b url(../../../img/icon_arrow2_pc.gif) no-repeat right center;
		font-family: "Noto Sans Japanese";
		font-weight: 300;
		font-size: 1.4rem;
		padding: 10px 0;
		color: #ffffff;
		text-align: center;
		margin: 20px auto 20px;
		text-indent: -10px;
	}
	a#more_news_btn:hover {
		transition: all 0.5s ease 0s;
		opacity: 0.5;
	}
    
    .form-search{
		display: flex;
		flex-wrap: nowrap;
		width: 106%;
		height: 48px;
		margin: 8px 0 0;
		box-shadow: 0 0 5px -1px rgba(0, 0, 0, .15);
	}

	.form-search .txt {
		width: 60%;
		height: 48px;
		padding: 0 13px;
		font-size: calc(100vw / 37.5*1.45);
		border: solid 1px #e3e3e3;
		border-right: 0;
		border-radius: 3px 0 0 0px;
	}

    .form-search .btn {
		position: relative;
		width: 25%;
		height: 37px;
		font-size: 16px;
		color: #fff;
		background: #7cbd60;
		border-radius: 0 3px 3px 0;
		transition: opacity .2s;
		padding: 13px 0px 0px 10px;
	}

	.form-search .btn:hover{
		transition: all 0.5s ease 0s;
		opacity: 0.5;
	}

	.form-search .btn .btn-txt {
		padding: 28px 10% 0px 13%;
	}

	.form-search .btn .btn-txt::before, .form-search .btn .btn-txt::after {
		position: absolute;
		display: block;
		content: "";
	}

	.form-search .btn .btn-txt::before{
		top: 14px;
		right: 15px;
		width: 10px;
		height: 10px;
		border: solid 2px #fff;
		border-radius: 50%;
	}

	.form-search .btn .btn-txt::after{
		top: 28px;
		right: 10px;
		width: 10px;
		height: 2px;
		background: #fff;
		border-radius: 2px;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}

    /*********  js-tab ************/

	.tab-list{
		position: relative;
		display: flex;
		flex-wrap: nowrap;
		margin: 0 0 0 0;
	}

	.tab-list::before {
		position: absolute;
		top: 100%;
		left: 0px;
		width: 100%;
		height: 8px;
		background: #fff;
		content: "";
		z-index: 9001;
	}

    .tab-01 .tab-list li {
		width: 50%;
		padding: 0 0 0 0px;
		display: flex;
		justify-content: center;
		align-items: center;
		margin: 0 1% 0 1%;
		height: 53px;
		background-color: #eeeeee;
		border-radius: 3px 3px 0 0;
		box-shadow: 0 2px 8px 0 rgba(0, 0, 0, .08);
	}

	.tab-01 .tab-list li:nth-child(1){
		margin: 0 1% 0 0;
	}

	.tab-01 .tab-list li:last-child{
		margin: 0 0 0 1%;
	}

	.tab-01 .tab-list li a {
		font-size: 14px;
		color: #707070;
	}

	.tab-01 .tab-list li a:hover {
		transition: all 0.2s ease 0s;
		color: #6eb92b;
    }

	.tab-01 .tab-list .is-active{
		background-color: #fff;
		border-top: solid 4px #7cbd60;
		z-index: 9000;
	}
    
    .tab-01 .tab-list .is-active a{
    	color: #7cbd60;
    	font-weight: 500;
    }

    .tab-content{
    	width: 100%;
    	/* height: 264px; */
    	background: #fff;
    	border-radius: 0 0 3px 3px;
    	margin: 0 0 43px;
    	box-shadow: 0 2px 8px 0 rgba(0, 0, 0, .08);
    	padding: 0px 0 12px;
    }

    .careers .tab-content{
    	width: 100%;
    	
    }

    .tab-content .tab-panel{
    	padding: 1px 5% 0px;
    	/* overflow: scroll; */
    	/* height: 336px; */
    }

    .careers .tab-content .tab-panel{
    	/* padding: 10px 10px 0px 0px; */
    }

    .tab-content .tab-panel li{
    	width: 100%;
    	padding: 3px 0% 3px;
    	margin: 23px 0 18px;
    	/* display: inline-block; */
    	font-size: calc(100vw / 37.5*1.6);
    	border-bottom: 1px #edf0f2 solid;
    }

    .careers .tab-content .tab-panel li{
    	/* width: 100%; */
    	/* margin: 6px 2px; */
    }

    .tab-content .tab-panel li a{
    	font-size:13px;
    	color: #707070;
    }

    .tab-content .tab-panel li a:hover {
		transition: all 0.2s ease 0s;
		color: #6eb92b;
    }

    .ico_arrow {
		display:inline-block;
		line-height:1;
	}
	
	.ico_arrow:before {
		/* content: ""; */
		width: 6px;
		height: 6px;
		border-top: 1px solid #acacac;
		border-right: 1px solid #acacac;
		position: absolute;
		-webkit-transform:translate(-50%, -50%);
		transform:translate(-50%, -50%);
		transform: rotate(45deg);
		margin: 3px -16px;
	}

    .panel{
		display:none;
	}

	.panel.is-show{
		display:block;
	}


    /*********  conditions ************/
    
    .conditions .tab-01 .tab-list li {
		width: 178px;
		}

    .conditions .tab-content{
    	/* height: 295px; */
    }


    /*********  section02 ************/

    #sec02{
        width: 93%;
        font-family: "Noto Sans Japanese";
        /* float: right; */
        margin: 0 auto;
    }

	.search{
		margin: 44px 0 48px;
	}

    #sec02 h2{
    	font-size: calc(100vw / 37.5*1.5);
    	font-family: "Noto Sans Japanese";
    	color: #6e6e6e;
    	margin: 0 0 0px;
    }

    #sec02 h2 span{
    	font-size: calc(100vw / 37.5*1.4);
    	color: #6e6e6e;
    	background-color: #f2f2f2;
    	padding: 4px 14px;
    	border-radius: 19px;
    	margin: 0 10px 0 0;
    }

    #sec02 .info{
    	margin: 2px 0 36px;
    	padding: 0 0 10px;
    }

    #sec02 .info h2{
    	font-size: 14px;
    	font-family: "Noto Sans Japanese";
    	color: #6e6e6e;
    	margin: 0px 0 6px;
    	padding: 5px 5%;
    	background-color: #f2f2f2;
    	width: 86px;
    }

    #sec02 .info p{
    	font-weight:300;
    	font-size: 14px;
    	color: #6e6e6e;
    	margin: 0 5%;
    }

    #sec02 .Recommend ul{
    	/* box-shadow: 0 2px 8px 0 rgba(0, 0, 0, .08); */
    	width: 100%;
    }

    #sec02 .Recommend li{
    	border-bottom: 2px solid #f2f2f2;
    }

    #sec02 .Recommend li a{
    	display: block;
    	padding: 16px 0 7px;
    }

    #sec02 .Recommend li a:hover{
		transition: all 0.5s ease 0s;
		opacity: 0.5;
	}

    #sec02 .Recommend li a .in_rec{
    	background: url("../img/icon_arrow_circle.png") right no-repeat;
    	background-size: 6%;
    }
    
    #sec02 .Recommend li span:nth-child(1){
    	background-color: #7cbd60;
    	padding: 1px 10px;
    	color: #ffffff;
    	font-size: calc(100vw / 37.5*1.2);
    	float: left;
    }

    #sec02 .Recommend li h3{
    	color: #7cbd60;
    	font-weight: 400;
    	font-size: calc(100vw / 37.5*1.5);
    	margin: 2px 2% 0;
    	display: inline-block;
    }

    #sec02 .Recommend li span:last-child{
    	color: #6e6e6e;
    	font-size: calc(100vw / 37.5*1.2);
    	line-height:16px;
    	font-weight: 300;
    	margin: 6px 0 0;
    	width: 85%;
    	display: inline-block;
    }
    
    /*********  section04 ************/

    #sec04{
    	/* margin: 1228px 0 20px; */
    	width: 100%;
    	font-family: "Noto Sans Japanese";
    }

    #sec04 .career{
    	display: flex;
    	/* justify-content: space-between; */
    	flex-wrap: wrap;
    	width: 100%;
    	margin: 0 auto;
    }

    #sec04 a{
    	position: relative;
    }

    #sec04 li{
    	margin: 0px auto 26px;
    }

    #sec04 li:hover{
		transition: all 0.5s ease 0s;
		opacity: 0.5;
	}
   
    #sec04 h2{
    	font-size: calc(100vw / 37.5*1.4);
    	background-color: #434343;
    	width: 30%;
    	height: 21px;
    	text-align: center;
    	color: #fff;
    	font-weight: 100;
    	border-radius: 30px 30px;
    	margin: 0 0 -15px 10px;
    	z-index: 92;
    	position: relative;
    }

    #sec04 h3{
		position: absolute;
		top: 10px;
    	right: 50px;
    	background-color: #7cbd60;
    	color: #fff;
    	font-size: calc(100vw / 37.5*1.5);
    	width: 160px;
    	height: 24px;
    	text-align: center;
    	padding: 2px 0 0;
    	margin: -50px -40px 0 150px;
    }

    #sec04 h4{
		position: absolute;
		top: -10px;
    	right: 10px;
    	background-color: #434343;
    	color: #fff;
    	font-size: calc(100vw / 37.5*1.2);
    	font-weight: 200;
    	width: 160px;
    	height: 20px;
    	text-align: center;
    	padding: 2px 0 0;
    	margin: 0px;
    }
    
    #sec04 .bottun{
    	text-align: center;
    	margin: 0 auto;
    }

    #sec04 .bottun a{
    	background: #6eb92b url(../../../img/icon_arrow2_pc.gif) no-repeat right center;
    	color: #fff;
    	text-align: center;
    	margin: 0 auto;
    	width: 200px;
    	padding: 10px 40px 12px;
    	position: relative;
    	font-size: calc(100vw / 37.5*1.4);
    }

    #sec04 .bottun a:hover{
		transition: all 0.5s ease 0s;

		opacity: 0.5;
	}



/*===============================================
　画面の横幅が350pxまで▼▼▼▼▼
===============================================*/

/*********  SPヘッダー iPhone5サイズ対応 ************/
@media screen and (max-width:349px) {
	
	
}


