@charset "utf-8";
/*--------------------------------------
	copyright : Lampros co.,Ltd.
--------------------------------------*/

@import url(normalize.css);
@import url(fontawesome-all.css);
@import url(common_parts.css);
@import url(common.css);


/*
 index
==============================*/
[class^="row-"], [class*=" row-"] {
    opacity: 1;
}

/* header ----------*/
#header { overflow: hidden; background-size: contain; background-repeat: no-repeat; background-position: left top; }
#header-circle { position: absolute; z-index: 1; top: -6.25vw; left: -6.25vw; width: 37.5vw; height: 37.5vw; text-align: center; background-color: #D90000; -webkit-border-radius:50%; -moz-border-radius:50%; -o-border-radius:50%; -ms-border-radius:50%; border-radius:50%; -webkit-transform:rotate(-10deg); -moz-transform:rotate(-10deg); -o-transform:rotate(-10deg); -ms-transform:rotate(-10deg); transform:rotate(-10deg); }
#header-circle::after { position: absolute; top: 15.5vw; left: 11.7vw; content: ""; width: 37.25vw; height: 33.25vw; background-image: url(../_img/index/japan.png); background-size: cover; }
#header-logo { padding-top: calc(50% - 6vw); font-family: 'Kaushan Script', cursive; font-weight: normal; font-size: 6.25vw; color: #FFF; line-height: 1; }
#header p { padding-top: 2vw; font-size: 1.25vw; color: #FFF; text-align: center; line-height: 1.3; }
#header-mv { position: relative; background-image: url(../_img/index/mv_1.jpg); background-size: cover; }
#header-mv:before { position: absolute; bottom: 0; right: 0; content: ""; width: 17.68vw; height: 20.68vw; background-image: url(../_img/index/mv_bg.png); background-size: cover; }
#header-feature {}
#header-feature li {}
#header-feature li:first-child { margin-bottom: 1rem; }
#header-feature li a { position: relative; display: block; padding-top: 49.2%; background-size: cover; background-position: center center; }
#header-feature li a span { position: absolute; top: calc(50% - 1.2rem); display: block; width: 100%; font-size: 3.6rem; font-weight: bold; color: #FFF; text-align: center; line-height: 1; }
@media screen and (max-width:768px) { /* iPad 縦 m */
	#header-circle { top: -11.25vw; left: -11.25vw; width: 67.5vw; height: 67.5vw; }
	#header-circle::after { top: 27.9vw; left: 21.6vw; width: 67.05vw; height: 59.85vw; }
	#header-logo { padding-top: calc(50% - 10.8vw); font-size: 11.25vw; }
	#header p { padding-top: 3.6vw; font-size: 2.25vw; }
	#header-mv { padding-top: 65%; background-size: cover; background-position: center center; }
	#header-mv:before { width: 26.52vw; height: 31.02vw; }
	#header-feature { padding: 0 1rem; }
}

/* picup ----------*/
#picup { padding: 6rem;
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top, #ffffff 0%, #BBCDD9 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #ffffff 0%,#BBCDD9 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #ffffff 0%,#BBCDD9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#BBCDD9',GradientType=0 ); /* IE6-9 */
}
#picup ul {}
#picup ul li {}
#picup ul li a { display: block; color: #536A77; background-color: #FFF; }
#picup ul li a img { width: 40%; vertical-align: middle; }
#picup ul li a span { display: inline-block; width: 60%; padding: 0 1rem 0 1.5rem; vertical-align: middle; word-break: break-all; line-height: 1; }
@media screen and (max-width:1024px) { /* iPad 横 l */
	#picup { padding: 4rem; }
}
@media screen and (max-width:768px) { /* iPad 縦 m */
	#picup { padding: 1rem; }
}

/* special ----------*/
#special { padding-top: 6rem; }
#special ul {}
#special ul li {}
#special ul li a { position: relative; display: block; padding-top: 68%; color: #FFF; background-size: 105%; background-position: center center; -webkit-transition:all 1s ease-in-out; -moz-transition:all 1s ease-in-out; -o-transition:all 1s ease-in-out; -ms-transition:all 1s ease-in-out; transition:all 0.5s ease-in-out; }
#special ul li a:before { position: absolute; z-index: 1; bottom: 0; right: 0; content: ""; width: 19rem; height: 22.2rem; background-image: url(../_img/index/mv_bg2.png); background-size: cover; opacity: 0.5; }
#special ul li a span { position: absolute; top:50%; display: block; width: 100%; font-size: 2rem; font-weight: normal; text-align: center; line-height: 1.2; -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -o-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%); }
#special ul li a span strong { font-size: 4rem; font-weight: bold; }
#special ul li a:hover { background-size: 115%; }
@media screen and (max-width:768px) { /* iPad 縦 m */
	#special ul li { margin-bottom: 2px; }
}

/* recommend ----------*/
#recommend { padding-top: 6rem; }
#recommend ul li { background-color: #000; }
#recommend ul li a { position: relative; display: block; padding-top: 68%; color: #FFF; background-size: cover; background-position: center center; }
#recommend ul li a span { position: absolute; top: 2rem; left: 2rem; display: block; width: 100%; font-size: 2.4rem; font-weight: normal; line-height: 1.2; }
#recommend ul li a span strong { font-size: 4rem; font-weight: bold; }

/* tour ----------*/
#tour { padding-top: 6rem; margin-bottom: 1px; }
#tour ul {}
#tour ul li {}
#tour ul li a { position: relative; display: block; padding-top: 68%; color: #FFF; background-size: cover; background-position: center center; }
#tour ul li a span { position: absolute; top:50%; display: block; width: 100%; font-size: 2.4rem; font-weight: normal; text-align: center; line-height: 1.2; -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -o-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%); }
#tour ul li a span strong { font-size: 4rem; font-weight: bold; }
