/*---------------------------------------------
	トップページ Style
  ---------------------------------------------*/

/* ------ Home ------ */

#mainvisual {
	width: 100%;
	overflow: hidden;
}
#mainvisual-inner {
	position:relative;
}
#mainvisual-inner .img {
	/*width: 1500px;
	margin-left: -750px;
	padding-left: 50%;*/
}
.mainslider {
	display:none;
}
.scroll-icon {
	position:absolute;
	bottom:20px;
	left:50%;
	margin-left:-22px;
	z-index:999;
}
.scroll-icon a {
	width:44px;
	height:48px;
	display:block;
	background:url(../images/pc/scroll_icon.png) no-repeat center center;
	transition: background 1s;
}
.scroll-icon a:hover {
	background:url(../images/pc/scroll_icon_on.png) no-repeat center center;
	-webkit-animation-name:fuwafuwa;
	-webkit-animation-duration:0.8s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:ease-out;
	
	-moz-animation-name:fuwafuwa;
	-moz-animation-duration:0.8s;
	-moz-animation-iteration-count:infinite;
	-moz-animation-timing-function:ease-out;
}
@-webkit-keyframes fuwafuwa {
	0% {-webkit-transform:translate(0, 0);}
	50% {-webkit-transform:translate(0, -8px);}
	100% {-webkit-transform:translate(0, 0);}
}
@-moz-keyframes fuwafuwa {
	0% {-moz-transform:translate(0, 0);}
	50% {-moz-transform:translate(0, -8px);}
	100% {-moz-transform:translate(0, 0);}
}

.section-content {
	padding:30px 0;
}
.container {
	/*width: 1230px;*/
	max-width:1230px;
	margin: 0 auto;
	padding: 0 0 20px;
}
.section-title {
	padding:0 15px;
	margin-bottom:10px;
}
.grid-item {
  float: left;
	/*margin:0 15px 30px;*/
	padding:0 1.2% 2.4%;
	box-sizing:border-box;
}
.grid-item a {
	display:block;
	overflow:hidden;
}

section {
	background-color:#fff;
}
section#campaign {
	background-color:#fff9ee;
}
section#campaign .fair-menu {
	padding:0;
}

section#menu {}
section#menu .tab {
	margin:0 0 15px;
	padding:0 15px;
}
section#menu .tab li {
	width:16.66%;
	margin-bottom:5px;
	padding:5px 15px 10px;
	float:left;
	text-align:center;
	box-sizing:border-box;
	cursor:pointer;
	position:relative;
	border-bottom:2px #fff solid;
}
section#menu .tab li.select {
	border-bottom:2px #fe4600 solid;
}
section#menu .tab li.select::before {
	content: '';
	position: absolute;
	bottom: -12px;
	left: 50%;
	width: 0;
	height: 0;
	margin-left:-5px;
	border: 5px solid transparent;
	border-top: 5px solid #fe4600;
}
section#menu .tab li::after {
	content: '';
	position: absolute;
	bottom: -2px;
	left: 0;
	width: 100%;
	height: 2px;
	-webkit-transform: scaleX(0);
	-ms-transform: scaleX(0);
	transform: scaleX(0);
	background-color: #fe4600;
	-webkit-transition: all .3s ease;
	transition: all .3s ease;
}
section#menu .tab li:hover::after {
	-webkit-transform: scaleX(1);
	-ms-transform: scaleX(1);
	transform: scaleX(1);
}
section#menu .tab-content {display:none;}
section#menu .show {display:block;}


section#menu li.grid-item {
	width:25%;
	/*height:185px;*/
}
section#menu li.grid-item.wx2 {
	width:50%;
	padding-bottom:2.385%
}
section#menu li.grid-item.hx2 {
	/*height:398px;*/
}

section#topics {
	background-color:#fff9ee;
}
section#topics .top-topics li {
	width:25%;
}
section#topics .top-topics li a {
	text-decoration:none;
}
section#topics .top-topics li div {
	/*min-height:255px;*/
	background-color:#fff;
	box-shadow:0 0 12px rgba(0,0,0,0.05);
	position:relative;
}
section#topics .top-topics li div:after {
	position:absolute;
	right:10px;
	bottom:10px;
	content:"";
	width: 60px;
	height: 20px;
	background:url(../images/more.png) no-repeat right bottom;
}
section#topics .top-topics li.wx2 {
	width:50%;
}
section#topics .top-topics li.wx2 div {
	/*min-height:540px;*/
}
section#topics .top-topics li span {
	display:block;
}
section#topics .top-topics li span.img {
	overflow:hidden;
}
section#topics .top-topics li span.img img {
	width:100%;
}
section#topics .top-topics li span.date {
	padding:10px;
	color:#6c6c6c;
	font-size:14px;
}
section#topics .top-topics li span.title {
	padding:0 10px 10px;
	min-height: 5em;
}
section#topics .top-topics li.wx2 span.date {
	padding:15px 15px 10px;
	color:#6c6c6c;
}
section#topics .top-topics li.wx2 span.title {
	padding:0 15px 20px;
	font-size:26px;
	line-height:1.3;
	min-height: 3em;
}
section#topics .top-topics li.wx2 span.txt {
	min-height: 5.5em;
}
section#topics .top-topics li span.txt {
	padding:0 15px 15px;
}
section#topics .top-topics li.grid-sizer {
	min-height:100%;
}
section#topics .top-topics li span.title .icon-pdf,
section#topics .top-topics li span.txt .icon-pdf {
	display:inline-block;
	width:20px;
	height:18px;
	margin-bottom:-3px;
	background:url(../images/icon_pdf.png) no-repeat right top;
	background-size:14px;
}

section#quality {
	
}
section#quality.section-content {
	padding:0;
}
section#quality .quality-box {
	width:50%;
	float:left;
}
section#quality .quality-box figcaption p {
	font-family: "Crimson Text";
	font-weight: 400;
	font-style: italic;
	font-size: 50px;
}
section#quality .quality-box div {
	padding:25px;
}
section#quality .quality-box div h3 {
	font-size: 18px;
	color:#4f3009;
	padding-bottom:10px;
	padding-left:18px;
	font-weight:bold;
	background:url(../images/icon_link.png) no-repeat left 4px;
}
section#quality .quality-box div p {
	font-size: 16px;
}
section#quality .quality-box a {
	text-decoration:none;
}

section#caution .caution-tb {
	padding:0 15px;
}
section#caution th {
	width:200px;
	padding:30px;
	text-align:center;
	font-size: 20px;
	border:1px #e4e4e4 solid;
	background-color:#e4e4e4;
}
section#caution td {
	padding:30px;
	font-size: 20px;
	border:1px #e4e4e4 solid;
	background-color:#f4f4f4;
}

.more-btn {
	padding-top:20px;
	text-align:center;
}
.more-btn a {
	display:inline-block;
	width:30%;
	padding:5px 5px 5px 20px;
	border:2px #dfdfdf solid;
	background:url(../images/arrow_nb.png) no-repeat 35px center;
}
.more-btn a:hover {
	background-color:#f2f4f6;
}

figure {
	position: relative;
	overflow: hidden;
}
figcaption {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,.6);
	-webkit-transition: .3s;
	transition: .3s;
	opacity: 0;
}
figcaption p {
	position: absolute;
	top: 40%;
	z-index: 1;
	opacity: 0;
	width: 100%;
	text-align:center;
	-webkit-transition: .3s;
	transition: .3s;
	color:#fff;
}
figure:hover figcaption {
	opacity: 1;
}
figure:hover figcaption p {
	top: 45%;
}
figure:hover figcaption p {
	opacity: 1;
	-webkit-transition-delay: .3s;
	transition-delay: .3s;
}

@media screen and (min-width: 769px) {

	section#campaign .top-campaign li {
		width:33.33%;
		float:left;
		padding:0 15px;
		box-sizing:border-box;
	}
	section#campaign .top-campaign li a {
		display:block;
		overflow:hidden;
	}
	
}

/*-----------------------------------------------------	*/
/*	for - 1201px以上					　　　　　　　　　　　　　*/
/*-----------------------------------------------------	*/

@media screen and (min-width: 1501px) {
	#mainvisual-inner .img {
		/*width: 100%;
		margin-left: -50%;
		padding-left: 50%;*/
	}
	section#quality .quality-box img {
		width: 100%;
	}

}


/*-----------------------------------------------------	*/
/*	for - 640px以下					　　　　　　　　　　　　　　*/
/*-----------------------------------------------------	*/

@media screen and (max-width: 768px) {
	.mainslider {
		display:block;
	}
	#mainvisual-inner .img {
		width: 100%;
		margin-left: 0;
		padding-left: 0;
	}
	.scroll-icon {
		display:none;
	}
	.container {
		width: 100%;
		padding:0;
		box-sizing:border-box;
	}
	
	section#campaign .top-campaign li {
		/*width:100%;
		float:none;
		margin:0;
		box-sizing:border-box;*/
	}
	
	section#menu li.grid-item {
		width:50%;
		height:auto;
		margin:0;
	}
	section#menu li.grid-item.wx2 {
		width:100%;
	}
	section#menu li.grid-item.hx2 {
		height:auto;
	}
	section#menu .tab {
		margin:0;
		padding:0;
	}
	section#menu .tab li {
		width:33.33%;
		margin-bottom:0;
		padding:10px 15px;
		float:left;
		text-align:center;
		box-sizing:border-box;
		cursor:pointer;
		position:relative;
		border-top:1px #fff solid;
		border-right:1px #fff solid;
		border-bottom:2px #eee solid;
		background-color:#eee;
	}
	section#menu .tab li.select::before {
		content: '';
		position: absolute;
		bottom: 0px;
		left: 50%;
		width: 0;
		height: 0;
		margin-left:-5px;
		border: 5px solid transparent;
		border-bottom: 5px solid #fe4600;
	}

	
	section#service .section-title {
		background-position:left 13px;
	}
	section#topics .top-topics li {
		width:50%;
		min-height:100%;
		margin:0;
		box-shadow:none;
	}
	section#topics .top-topics li.wx2 {
		width:100%;
		min-height:100%;
	}
	section#topics .top-topics li span.date {
		padding:8px 10px 5px;
		font-size:12px;
	}
	section#topics .top-topics li span.title {
		padding:0 10px;
		font-size:13px;
		min-height:5em;
	}
	section#topics .top-topics li.wx2 span.date {
		padding:10px;
		color:#6c6c6c;
	}
	section#topics .top-topics li.wx2 span.title {
		padding:0 10px 10px;
		font-size:16px;
		line-height:1.3;
		min-height:1.3em;
	}
	section#topics .top-topics li span.txt {
		padding:0 10px 10px;
	}
	section#topics .top-topics li div:after {
		background-size:40px;
	}
	
	section#quality {
		min-width:320px;
	}
	section#quality .quality-box {
		width:100%;
		float:none;
	}
	section#quality .quality-box div {
		padding:15px;
	}
	section#quality .quality-box div h3 {
		font-size: 14px;
		color:#4f3009;
		padding-bottom:10px;
		font-weight:bold;
	}
	section#quality .quality-box div p {
		font-size: 12px;
	}
	
	section#caution .caution-tb {
		padding:0;
	}
	section#caution th {
		display:block;
		width:100%;
		padding:15px 0;
		text-align:center;
		font-size: 14px;
		font-weight:bold;
		box-sizing:border-box;
	}
	section#caution td {
		display:block;
		padding:15px 0;
		text-align:center;
		font-size: 12px;
		box-sizing:border-box;
	}
	
	
	.more-btn a {
		background-position:15px center;
	}
	
	.wideslider {
    width: 100%;
    text-align: left;
    position: relative;
    overflow: hidden;
		box-sizing:border-box;
	}
	.wideslider ul,
	.wideslider ul li {
		float: left;
		display: inline;
		overflow: hidden;
	}
	
	.wideslider ul li img {
		width: 100%;
		display: none;
		padding:0 10px;
		box-sizing:border-box;
	}
	
	.wideslider_base {
		top: 0;
		position: absolute;
	}
	.wideslider_wrap {
		top: 0;
		position: absolute;
		overflow: hidden;
	
	}
	.slider_prev,
	.slider_next {
		top: 0;
		overflow: hidden;
		position: absolute;
		z-index: 100;
		cursor: pointer;
	}
	.slider_prev {background: #fff url(../images/sp/prev.png) no-repeat right center; background-size:40px;}
	.slider_next {background: #fff url(../images/sp/next.png) no-repeat left center; background-size:40px;}
	
	.pagination {
		bottom: 10px;
		left: 0;
		width: 100%;
		height: 15px;
		text-align: center;
		position: absolute;
		z-index: 200;
	}
	
	.pagination a {
		margin: 0 5px;
		width: 15px;
		height: 15px;
		display: inline-block;
		overflow: hidden;
		background: #333;
	}
	.pagination a.active {
		filter:alpha(opacity=100)!important;
		-moz-opacity: 1!important;
		opacity: 1!important;
	}
	
	
	/* =======================================
		ClearFixElements
	======================================= */
	.wideslider ul:after {
		content: ".";
		height: 0;
		clear: both;
		display: block;
		visibility: hidden;
	}
	
	.wideslider ul {
		display: inline-block;
		overflow: hidden;
	}
	
}


/*---------------------------------------------
	カウントダウン ポップアップ
  ---------------------------------------------*/
html,body {
	height: 100%;
}
* html .layer_board_bg,
* html .layer_board {
	position: absolute;
}
.layer_board_bg {
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 1000;
	top: 0;
	left: 0;
	display: none;
	cursor: pointer;
	background: #000;
}
.layer_board {
	display: none;
	position:fixed;
	top: 0;
	left:50%;
	margin-left:-440px;
	margin-top:120px;
	max-width:1000px;
	text-align: center;
	cursor: pointer;
	z-index: 2000;
}
.layer_board_box {
	position:relative;
}
.layer_board_box img {
	max-width:100%;
}

.youtube2 {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube2 iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

.yycountdown-box{
	position:absolute;
	top:53.2%;
	width:100%;
	margin:0 auto;
	padding-left:20%;
	text-align:center;
	color:#333;
	box-sizing:border-box;
}
.yycountdown-box p {
	display:inline-block;
}
.yycountdown-box p:first-child {
	padding-right:10px;
}

#timer .yycountdown-box p .yyc-day,
#timer .yycountdown-box p .yyc-hou,
#timer .yycountdown-box p .yyc-min,
#timer .yycountdown-box p .yyc-sec{
	font-size:34px;
	font-weight:bold;
	line-height:0.8em;
}

#timer .yycountdown-box .yyc-day-text,
#timer .yycountdown-box .yyc-hou-text,
#timer .yycountdown-box .yyc-min-text,
#timer .yycountdown-box .yyc-sec-text{
	font-size:11px;
	display:block;
	font-style:italic;
	line-height:0.8em;
}
#timer .yycountdown-box .yyc-hou-text,
#timer .yycountdown-box .yyc-min-text {
	padding-right:10px;
}
/*
.close_btn {
	position:absolute;
	right:15px;
	top:20px;
	font-size:50px;
	color:#FFF;
	text-align:right;
}
*/
@media screen and (max-width: 999px) {
	.layer_board {
		left:5%;
		margin:80px auto 0;
		width:90%;
	}
	#timer .yycountdown-box p .yyc-day,
	#timer .yycountdown-box p .yyc-hou,
	#timer .yycountdown-box p .yyc-min,
	#timer .yycountdown-box p .yyc-sec{
		font-size:28px;
	}
	
	#timer .yycountdown-box .yyc-day-text,
	#timer .yycountdown-box .yyc-hou-text,
	#timer .yycountdown-box .yyc-min-text,
	#timer .yycountdown-box .yyc-sec-text{
		font-size:10px;
	}
}
@media screen and (max-width: 768px) {
	.layer_board {
		margin:6% auto 0;
	}
	.yycountdown-box{
		top:53%;
		width:100%;
		margin:0 auto;
		padding-left:0;
	}
	#timer .yycountdown-box p .yyc-day,
	#timer .yycountdown-box p .yyc-hou,
	#timer .yycountdown-box p .yyc-min,
	#timer .yycountdown-box p .yyc-sec{
		font-size:38px;
	}
	
	#timer .yycountdown-box .yyc-day-text,
	#timer .yycountdown-box .yyc-hou-text,
	#timer .yycountdown-box .yyc-min-text,
	#timer .yycountdown-box .yyc-sec-text{
		font-size:10px;
	}
	.close_btn {
		font-size:40px;
	}
}
@media screen and (max-width: 600px) {
	.yycountdown-box{
		position:absolute;
		top:53%;
	}
	#timer .yycountdown-box p .yyc-day,
	#timer .yycountdown-box p .yyc-hou,
	#timer .yycountdown-box p .yyc-min,
	#timer .yycountdown-box p .yyc-sec{
		font-size:28px;
	}
	
	#timer .yycountdown-box .yyc-day-text,
	#timer .yycountdown-box .yyc-hou-text,
	#timer .yycountdown-box .yyc-min-text,
	#timer .yycountdown-box .yyc-sec-text{
		font-size:10px;
	}
	.close_btn {
		right:10px;
		top:15px;
		font-size:30px;
	}
}

.set-jpg {
	position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
}

@media screen and (max-width: 600px) {
	.set-jpg {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
	}
	.set-jpg iframe {
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	}
}