@charset "utf-8";
/**
 * style
 * (c) FOURDIGIT Inc.
 *
 * 1. import
 * 2. html, body
 * 3. HTMLtag, siteCommonClass
 *
 */
/**
* 1. import
*/
@import "import/reset.css";
@import "import/sanitize.css";
@import "import/accessibility.css";
@import "import/animation.css";
@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);

/**
 * 2. html, body
 */
	body {
		background-color: #fff;
		/*overflow-x: hidden;*/
	}
	.page {
		color: #333;
		font-size: 14px;
		line-height: 1;
		/*letter-spacing: 0.1em;*/
		letter-spacing: normal;
		font-family:'Noto Sans Japanese','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
	}
	@media only screen and (max-width:600px) {
		* {
			transition: all 0s ease;
		}
	}
	div {box-sizing: border-box;}
	body > iframe {
		height: 0 !important;
		width: 0 !important;
		display: inline;
		position: absolute;
		bottom: 0;
		right: 0;
	}

/* Responsive */


	img{
		max-width: 100%;
		height: auto;
		vertical-align: bottom;
	}
	@media only screen and (max-width: 640px) {
	.img,.img img{
		width: 100% !important;
	}
	}
	i {
		vertical-align: middle;
	}


.imgBox{

	}
	@media only screen and (max-width: 640px) {
  	.imgBox div{
  		float:none !important;
  		width:auto !important;
  		margin-left:0px !important;
  		margin-right:0px !important;
  	}
	}


  .wrap {
  	width: 960px;
  	margin-right: auto;
  	margin-left: auto;
  	position:relative;
  }


	@media only screen and (max-width:960px) {
  	.wrap {
  		width: auto;
  		padding-left:10px;
  		padding-right:10px;
  	}
  	.wrapper {
  		width: auto;
  	}
	}


/**
 * 3. HTMLtag, siteCommonClass
 */
/* anchor */
	a {
		background-color: transparent;
		background-image: none;
		background-repeat: no-repeat;
		color: #000;
		text-decoration: none;
		transition: .2s ease-in-out;
	}
	a:visited {}
	a:hover {
		color: #999;
	}
	.fNav a:hover {
		/*text-decoration: underline;*/
	}
	a:active {}
	a img {transition: opacity .3s ease-in;}
	a:hover img {opacity: 0.7;}

	.hov {
		opacity: 1;
		-moz-opacity:1;
		transition: opacity 0.1s ease-in;
	}
	a:hover .hov {
		opacity: 0.75;
    filter: alpha(opacity=75);
    -moz-opacity: 0.75;
	}
	 /* IE8 */
    html>/**/body a:hover .hov {
        display /*\**/:inline-block\9;
        zoom /*\**/: 1\9;
    }

    /* 新旧Firefox */
   a:hover .hov, x:-moz-any-link { background-color:transparent;}
   a:hover .hov, x:-moz-any-link, x:default { background-color:transparent;}



   /* cap */
	.cap,
	.caption {
		background: none;
		color: #7e7e7e;
		font-size: 10px;
		line-height: 15px;
	}
	.cap {
		padding-top: 5px;
	}
  .imgcap {
		position: absolute;
		bottom: 5px;
  	right: 5px;
		font-weight: bold;
		font-size: 10px;
		line-height: 15px;
		color: #fff;
		text-shadow: 0 2px 2px rgba(0,0,0,0.9),
								 0 3px 3px rgba(0,0,0,0.6),
								 0 -1px 1px rgba(0,0,0,1.0);
  }

	.fimgcap {
		position: absolute;
		bottom: 5px;
		right: 50%;
		width: 960px;
		margin-right: -480px;
		font-weight: bold;
		font-size: 10px;
		line-height: 15px;
		text-align: right;
		color: #fff;
		text-shadow: 0px 2px 2px rgba(0,0,0,0.9),
								 0px 3px 3px rgba(0,0,0,0.6);
	}
@media only screen and (max-width:960px) {
	.fimgcap {
		right: 5px;
		width: auto;
		margin-right: 0;
		text-align: right;
	}
}

/* cont05 */
.col03_01 .ib > div {
    width: 31.25%;
    display: inline-block;
    vertical-align: top;
}
.col03_01 .ib > div:nth-child(2) {
    margin: 0 3.125%;
}
.col03_01 .caption {
    margin-top: 10px;
    text-align: right;
}
.col03_01 .imgBox {
    margin-bottom: 20px;
}
@media only screen and (min-width:600px) and (max-width:959px) {
}
@media only screen and (max-width:599px) {
    .col03_01 .ib > div {
        width: 100%;
        display: block;
        margin-bottom: 50px;
    }
    .col03_01 .ib > div:nth-child(2) {
        margin: 0 auto 30px;
    }
    .col03_01 .ib > div:last-child {
        margin-bottom: 0;
    }
    .col03_01 .imgBox img {
        width: 100%;
    }
	.pc {
		display: none;
	}
}
.maintitle + .cap p {
	font-size: 12px;
}
/* ul,li */
ul {
	/*letter-spacing: -0.4em;*/
}
li {
	letter-spacing: normal;
}

/* inlineblock */
.ib {
	letter-spacing: -0.4em;
}
.ib > div {
	letter-spacing: normal;
}


#loading {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	display: table;
	text-align: center;
	z-index: 999999999999;
	background-color: #fff;
}
#loading .inner {
	display: table-cell;
	vertical-align: middle;
}


/*header*/
header {width: 100%; position: absolute; top: 0; left: 0; z-index: 999999999;}
header .logo {padding: 20px;}
header .sns {position: absolute; top: 30px; right: 20px;}
header .sns li {display: inline-block; margin-left: 5px;}
header .sns li:first-child {margin-left: 0;}
header #gNav {position: absolute; top: 90px; right: 20px;}
header #gNav li {display: inline-block;}
header #gNav li a {color: #fff; position: relative; }
header #gNav li a: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: #fff;
	-webkit-transition: all .3s ease;
	transition: all .3s ease;
}
header #gNav li a:hover::after {
  -webkit-transform: scaleX(1);
  -ms-transform: scaleX(1);
  transform: scaleX(1);
}
header #gNav li:nth-child(2) {padding-left: 5px; padding-right: 5px;}
header #gNav li:nth-child(1){margin-right: 5px;}
header #gNav li:nth-child(2) {border-left: 1px solid #fff; border-right: 1px solid #fff;}
header #gNav li:nth-child(3){margin-left: 5px;}

@media screen and (max-width:768px) {
	header {
		position: absolute;
		top: 0;
		left: 0;
		background: #fff;
	}
	header .logo {padding: 10px 15px;}
	header .logo img {
		width: 50px;
	}
	header #gNav {
		display: none;
	}
	header .sns {
		top: 23px;
		right: 15px;
	}
}

/*footer*/
footer .link {width: 100%; position: relative; z-index: 99999; height: 130px; background: #fff;}
footer .logo {position: absolute; top: 43px; left: 100px;}
footer .btn {position: absolute; top: 33px; right: 100px;}
footer .sns {position: absolute; top: 45px; right: 340px;}
footer .fNav {position: absolute; top: 59px; left: 270px;}
footer .fNav ul {letter-spacing: -0.4em;}
footer .fNav ul li {display: inline-block; padding-left: 8px; padding-right: 8px; border-left: 1px solid #000;}
footer .fNav ul li a {font-size: 12px;}
footer .fNav ul li:first-child {border-left: 0px solid #000;}
footer .sns li {display: inline-block; margin-left: 5px;}
footer .sns li:first-child {margin-left: 0;}
footer .copy {background: #dddee0;}
footer .copy p {text-align: right; padding: 20px 50px 20px 0; font-size: 12px;}

@media screen and (max-width:1230px) {
	footer .logo {position: absolute; top: 73px; left: 100px;}
	footer .btn {position: absolute; top: 53px; right: 100px;}
	footer .sns {position: absolute; top: 65px; right: 340px;}
	footer .fNav {position: absolute; top: 21px; left: 0; right: 0; margin: auto; text-align: center;}
}
@media screen and (max-width:768px) {
	footer .link > div {
		position: static;
		text-align: center;
		margin-top: 20px;
	}
	footer .link > div:first-child {margin-top: 0;}
	footer .link .fNav {margin-top: 0;}
	footer .fNav ul li {margin-top: 20px;}
	footer .link {height: auto; padding: 30px 0;}
	footer .copy p {text-align: center; padding: 20px 0px 20px 0; font-size: 12px;}
}


/* body */
.cont h2 {font-size: 24px; text-align: center; margin-bottom: 60px;}
.cont h2 span {display: block; font-size: 12px; margin-top: 10px; color: #333;}
/* /#MV */
#PickUp {
	padding: 80px 0 240px;
	background-image: url(../imgs/pickup/bg01.gif) , url(../imgs/pickup/bg02.png);
	background-repeat: no-repeat, no-repeat;
	background-position: center top, center bottom;
	/*background-size: 100% auto, auto;*/

}
#PickUp h2 {color: #4dbeff;}
#PickUp .bnr {
	padding-bottom: 22px;
	max-width: 1080px;
	margin: 0 auto 30px;
	background: url(../imgs/pickup/bg_shadow.png);
	background-repeat: no-repeat;
	background-position: center bottom;
}
#PickUp .bnr a img {
	transition: 0.3s ease-in;
}
#PickUp .bnr a:hover img {
	transform: translateY(3px);
}
/* /#PickUp */
/*pagetop*/
#pageTop {
	background: #fff;
	padding: 10px 14px;
	position: absolute;
	bottom: -1px;
	right: 100px;
}
@media screen and (max-width: 768px) {
	#pageTop {
		right: 3%;
	}
}


.spCont{
	display: none;
}

@media only screen and (max-width: 640px) {
.pcCont{
	display: none;
}

.spCont{
	display: inline-block;
}
}