@charset "UTF-8";
#mainContent {
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}
@media all and (-ms-high-contrast:none){
    #mainContent {
      font-family: Century, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
      -webkit-transform: rotate(0.005deg);
      -ms-transform: rotate(0.005deg);
      transform: rotate(0.005deg);
    }
}


a:hover {
  text-decoration: none;
}

#mainContent {
  padding-top: 0;
	padding-bottom: 0;
  background: none;
}

@media only screen and (max-width: 768px) {
  #gFooter #CopyrightArea {
    margin-top: 40px;
    padding: 25px 0 0;
    border: solid 1px #e5e5e5;
  }
}

#gFooter {
  background: none;
  padding-top: 0;
  margin-top: 0;
}

#gFooter .wrap.clmList {
  display: none;
}

.pagetop {
  -webkit-transform: translateY(300%);
      -ms-transform: translateY(300%);
          transform: translateY(300%);
  -webkit-transition: 0.25s ease-out;
  -o-transition: 0.25s ease-out;
  transition: 0.25s ease-out;
  right: 20px;
}

.pagetop.active {
  -webkit-transform: translateY(0%);
  -ms-transform: translateY(0%);
  transform: translateY(0%);
}

@media screen and (min-width: 1025px) {
  #mainContent {
    padding-bottom: 0;
  }
}

@media screen and (max-width: 599px) {
  #mainContent {
    padding-bottom: 0;
  }
}

#container {
  overflow: hidden;
}

@media only screen and (max-width: 599px) {
  #gFooter #CopyrightArea li.last {
    display: block;
  }
  #gFooter #CopyrightArea img {
    margin: 10px;
  }
  #gFooter #CopyrightArea .fr {
    margin-bottom: 0 !important;
  }
  #copyright {
    margin-top: 20px;
  }
}

#footer {
  background: #fff;
  position: relative;
}
@media print, screen and (min-width: 600px) {
}

@media screen and (max-width: 599px) {
}

@media print, screen and (min-width: 600px) {
}

@media screen and (max-width: 599px) {
}


html.env-sp #gFooter #CopyrightArea {
  margin-top: 0;
}

html.env-tablet #gFooter #CopyrightArea {
  margin-top: 0;
}

@media screen and (max-width: 599px) {
}

.spinner {
  margin: 100px auto 0;
  width: 70px;
  text-align: center;
}

.spinner > div {
  width: 18px;
  height: 18px;
  background-color: #181d6f;
  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.spinner .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.spinner .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
  }
}

@keyframes sk-bouncedelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

#loader-bg {
  position: fixed;
  width: 100%;
  height: 100vh;
  top: 0px;
  left: 0px;
  background: #fff;
  z-index: 1;
}

#loader {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 200px;
  height: 200px;
  margin-top: -100px;
  margin-left: -100px;
  text-align: center;
  color: #fff;
  z-index: 2;
}

/* ===================== */

#mainContent {
	position: relative;
	background: url("../imgs/bg.jpg") 50% 0 / 100% auto fixed;
}
@media screen and (max-width: 1440px) {
	#mainContent {
		background-size: 1440px auto;
	}
}
@media screen and (max-width: 599px) {
	#mainContent {
		background-image: url("../imgs/bg01_sp.png"), url("../imgs/bg02_sp.jpg");
		background-position: 0 0;
		background-size: 100% auto;
		background-repeat: no-repeat, repeat-y;
		background-attachment: scroll;
	}
}

.mainVisial {
	display: flex;
	height: 100vh;
	align-items: center;
	justify-content: center;
}
.mainVisial img {
	width: calc(100% * 554 / 1024);
	max-width: 554px;
	opacity: 0;
	transition: opacity 2s 1s;
}
.mainVisial.active img {
	opacity: 1;
}
.mainVisial::before {
	content: 'Scroll';
	display: block;
	position: fixed;
	bottom: 108px;
	left: 50%;
	color: #fff;
	font-size: 16px;
	line-height: 1;
	text-shadow: 0 0 2px rgba(88,151,186,1), 0 0 4px rgba(88,151,186,1), 0 0 6px rgba(88,151,186,1), 0 0 8px rgba(88,151,186,1), 0 0 10px rgba(88,151,186,1);
	transform: translateX(-50%);
}
.mainVisial::after {
	content: '';
	display: block;
	width: 1px;
	height: 100px;
	position: fixed;
	bottom: 0;
	left: 50%;
	background: #fff;
	box-shadow: 0 0 10px 10px rgba(88,151,186,.5);
	-webkit-animation: blink 1s infinite alternate;
	animation: blink 1s infinite alternate;
}
@-webkit-keyframes blink {
	0%   { opacity: 1; }
	100% { opacity: 0; }
}
@keyframes blink {
	0%   { opacity: 1; }
	100% { opacity: 0; }
}
.mainVisial.scrollout::before,
.mainVisial.scrollout::after {
	content: none;
}
@media screen and (max-width: 599px) {
	.mainVisial {
		box-sizing: border-box;
		padding-bottom: calc(100vw * 140 / 750);
	}
	.mainVisial img {
		width: calc(100% * 1291 / 1500);
		max-width: none;
	}
	.mainVisial::before {
		bottom: calc(100vw * 108 / 750);
		font-size: calc(100vw * 32 / 750);
	}
	.mainVisial::after {
		height: calc(100vw * 100 / 750);
	}
}

.wrapper {
	max-width: 1024px;
	margin: 0 auto;
	padding: 0 2.94118%;
}
@media screen and (max-width: 599px) {
	.wrapper {
		padding: 0;
	}
}

.campaign {
	background: rgba(255,255,255,.6);
}
.campaign .title {
	padding: calc(100% * 36 / 1024) 0 0;
}
.campaign p {
	padding: calc(100% * 16 / 1024) 0 0;
	font-size: 12px;
	line-height: 2;
	letter-spacing: .1em;
	text-align: center;
}
.campaign .cance01 {
	width: calc(100% * 964 / 1024);
	margin: 0 auto;
	padding: calc(100% * 44 / 1024) 0 0;
}
.campaign .prize {
	padding: calc(100% * 30 / 1024) calc(100% * 40 / 1024) 0 calc(100% * 24 / 1024);
}
.campaign ul {
	display: flex;
	padding: calc(100% * 40 / 1024) 0 0;
	justify-content: center;
}
.campaign li {
	width: calc(100% * 320 / 1024);
}
.campaign li + li{
	padding: 0 0 0 calc(100% * 8 / 1024);
}
.campaign .cance02 {
	width: calc(100% * 964 / 1024);
	margin: 0 auto;
	padding: calc(100% * 42 / 1024) 0 calc(100% * 50 / 1024);
}
@media screen and (max-width: 1088px) {
	.campaign p {
		font-size: calc(100vw * 18 / 1088);
	}
}
@media screen and (max-width: 599px) {
	.campaign {
		margin: 0 calc(100vw * 45 / 750);
	}
	.campaign .title {
		padding: calc(100vw * 26 / 750) 0 0;
	}
	.campaign p {
		padding: calc(100vw * 24 / 750) 0 0;
		font-size: calc(100vw * 28 / 750);
		letter-spacing: 0;
	}
	.campaign .cance01 {
		width: auto;
		margin: 0 ;
		padding: calc(100vw * 50 / 750) 0 0;
	}
	.campaign .prize {
		width: calc(100vw * 1184 / 1500);
		margin: 0 auto;
		padding: calc(100vw * 40 / 750) 0 0;
	}
	.campaign ul {
		display: block ;
		width: calc(100vw * 1184 / 1500);
		margin: 0 auto;
		padding: 0;
	}
	.campaign li,
	.campaign li + li {
		width: auto;
		padding: calc(100vw * 36.5 / 750) 0 0;
	}
	.campaign .cance02 {
		width: auto;
		margin: 0;
		padding: calc(100vw * 44.5 / 750) 0 calc(100vw * 70 / 750);
	}
}

.list {
	margin: 70px 0 0;
	background: rgba(255,255,255,.85);
}
.list .title,
.agreement .title {
	padding: calc(100% * 55 / 1024) 0 calc(100% * 40 / 1024);
	color: #002a6f;
	font-family: '游明朝 Demibold', '游明朝体 デミボールド', 'Yu Mincho Demibold', 'YuMincho Demibold', serif;
	line-height: 1;
	text-align: center;
	text-shadow: 0 0 2px #fff, 0 0 4px #fff, 0 0 6px #fff, 0 0 8px #fff, 0 0 10px #fff;
}
.list .title .ja,
.agreement .title .ja {
	display: block;
	font-size: 32px;
	letter-spacing: .2em;
}
.list .title .en,
.agreement .title .en {
	display: block;
	padding: 1em 0 0;
	font-size: 12px;
	letter-spacing: .16em;
}
.list .sNav {
	display: flex;
	width: calc(100% * 979 / 1024);
	margin: 0 auto;
	border-top: 1px solid #002a6f;
	border-bottom: 1px solid #002a6f;
	padding: calc(100% * 5 / 1024) calc(100% * 9 / 1024);
	font-size: 16px;
	letter-spacing: .1em;
	line-height: 2.1252; /* 34 */
}
.list .sNav li {
	box-sizing: border-box;
	width: calc(33% - 0.8px);
	padding: 0 calc(100% * 5 / 979);
}
.list .sNav li + li {
	border-left: 1px solid #e6e6d7;
}
.list .sNav a {
	display: block;
	position: relative;
	text-align: center;
	transition: .3s;
}
.list .sNav a::before,
.list .sNav a::after {
	content: '';
	display: block;
	width: 1px;
	position: absolute;
	left: 50%;
	opacity: 0;
	transition: .3s;
}
.list .sNav a::before {
	height: 0.3125em;
	bottom: 0;
	background: #fff;
}
.list .sNav a::after {
	height: 1.25em;
	top: 100%;
	background: #002a6f;
}
.list .sNav a.active,
.list .sNav a:hover {
	background: #002a6f;
	color: #fff;
}
.list .sNav a.active::before,
.list .sNav a.active::after,
.list .sNav a:hover::before,
.list .sNav a:hover::after {
	opacity: 1;
}
.list .data {
	padding: 0 0 calc(100% * 50 / 1024);
}
.list .area {
	display: none;
}
.list .area.active {
	display: block;
}
.list .mansion {
	width: calc(100% * 964 / 1024);
	margin: 40px auto 0;
	position: relative;
}
.list .mansion .image {
	width: calc(100% * 584 / 964);
}
.list .mansion:nth-child(even) .image {
	margin: 0 0 0 calc(100% * 380 / 964);
}
.list .mansion .text {
	box-sizing: border-box;
	width: calc(100% * 480 / 964);
	border: 1px solid #002a6f;
	padding: calc(100% * 24 / 964) calc(100% * 24 / 964) calc(100% * 29 / 964) calc(100% * 28 / 964);
	position: absolute;
	top: 48px;
	right: 0;
	background: rgba(255,255,255,.9);
}
.list .mansion:nth-child(even) .text {
	right: auto;
	left: 0;
}
.list .mansion .name {
	font-size: 26px;
	letter-spacing: .1em;
	line-height: 1.3842; /* 36px */
}
.list .mansion .areaName {
	display: inline-block;
	box-sizing: border-box;
	width: 6.42857em;
	margin: 0 0 0 1.42857em;
	border: 1px solid #002a6f;
	color: #002a6f;
	font-size: .53846em;
	line-height: 1.5;
	text-align: center;
	vertical-align: top;
	transform: translateY(21.73913%);
}
.list .mansion p {
	padding: calc(100% * 19 / 426) calc(100% * 4 / 426) calc(100% * 34 / 426);
	font-size: 14px;
	line-height: 1.85714; /* 26px */
}
.list .mansion .btn {
	display: flex;
	flex-wrap: wrap;
	line-height: 1px;
	justify-content: space-between;
}
.list .mansion .btn li {
	width: calc(100% * 205 / 426);
}
.list .mansion .btn li:first-child {
	width: 100%;
	padding: 0 0 calc(100% * 16 / 426);
}
.list .mansion .btn a {
	display: block;
	background: #fff;
}
.list .mansion .btn img {
	transition: opacity .3s;
}
.list .mansion .btn a:hover img {
	opacity: .8;
}
@media screen and (max-width: 1088px) {
	.list {
		margin: calc(100vw * 70 / 1088) 0 0;
	}
	.list .title .ja,
	.agreement .title .ja {
		font-size: calc(100vw * 32 / 1088);
	}
	.list .title .en,
	.agreement .title .en {
		font-size: calc(100vw * 12 / 1088);
	}
	.list .sNav {
		font-size: calc(100vw * 16 / 1088);
	}
	.list .mansion {
		margin: calc(100vw * 40 / 1088) auto 0;
	}
	.list .mansion .text {
		top: calc(100vw * 48 / 1088);
	}
	.list .mansion .name {
		font-size: calc(100vw * 26 / 1088);
	}
	.list .mansion p {
		font-size: calc(100vw * 14 / 1088);
	}
}
@media screen and (max-width: 599px) {
	.list {
		margin: calc(100vw * 120 / 750) 0 0;
	}
	.list .title,
	.agreement .title {
		padding: calc(100vw * 110 / 750) 0 calc(100vw * 100 / 750);
	}
	.list .title .ja,
	.agreement .title .ja {
		font-size: calc(100vw * 54 / 750);
	}
	.list .title .en,
	.agreement .title .en {
		padding: 2em 0 0;
		font-size: calc(100vw * 20 / 750);
	}
	.list .sNav {
		width: auto;
		margin: 0;
		padding: 0;
		font-size: calc(100vw * 30 / 750);
		letter-spacing: 0;
		line-height: calc(100vw * 80 / 750);
		flex-wrap: wrap;
		justify-content: center;
	}
	.list .sNav li {
		width: calc(33.33333% - 0.5px);
		padding: calc(100vw * 20 / 750) calc(100vw * 10 / 750 + 1px) calc(100vw * 20 / 750) calc(100vw * 10 / 750);
		position: relative;
	}
	.list .sNav li:nth-child(-n+3) {
		border-bottom: 1px solid #ab9642;
	}
	.list .sNav li:nth-child(3),
	.list .sNav li:nth-child(5) {
		padding-right: calc(100vw * 10 / 750);
	}
	.list .sNav li:nth-child(1)::after,
	.list .sNav li:nth-child(2)::after,
	.list .sNav li:nth-child(4)::after {
		content: '';
		display: block;
		width: 1px;
		position: absolute;
		top: calc(100vw * 20 / 750);
		right: 0;
		bottom: calc(100vw * 20 / 750);
		background: #e7e7d7;
	}
	.list .sNav li + li {
		border-left: none;
	}
	.list .sNav a::before,
	.list .sNav a::after {
		content: none;
	}
	.list .data {
		padding: 0 0 calc(100vw * 55 / 750);
	}
	.list .mansion {
		width: auto;
		margin: calc(100vw * 120 / 750) 0 0;
	}
	.list .mansion .image {
		width: auto;
	}
	.list .mansion:nth-child(even) .image {
		margin: 0;
	}
	.list .mansion .text {
		width: auto;
		border-right: none;
		border-left: none;
		padding: calc(100vw * 42 / 750) calc(100vw * 45 / 750) calc(100vw * 47 / 750);
		position: static;
		background: #fff ;
		transform: none;
	}
	.list .mansion:nth-child(even) .text {
		right: auto;
		left: 0;
	}
	.list .mansion .name {
		font-size: calc(100vw * 44 / 750);
	}
	.list .mansion p {
		padding: calc(100vw * 30 / 750) 0 calc(100vw * 70 / 750);
		font-size: calc(100vw * 24 / 750);
	}
	.list .mansion .btn {
		display: flex;
		flex-wrap: wrap;
		line-height: 1px;
		justify-content: space-between;
	}
	.list .mansion .btn li {
		width: calc(100vw * 318 / 750);
	}
	.list .mansion .btn li:first-child {
		width: 100%;
		padding: 0 0 calc(100vw * 20 / 750);
	}
}

.agreement {
	margin: 80px 0 0;
	background: rgba(255,255,255,.85);
  padding-bottom: 45px;
}
.agreement .term {
	border: 1px solid #002a6f;
	padding: calc(100% * 55 / 1024);
	background: #fff;
	font-size: 14px;
	line-height: 2.57143; /* 36px */
}
.agreement .term .scroll {
	height: 584px;
	overflow-y: scroll;
  padding-right: 10px;
}
.agreement .note {
	padding: calc(100% * 40 / 1024) 0 calc(100% * 45 / 1024);
	color: #666;
	font-size: 11px;
	line-height: 2.18132; /* 24px */
}
@media screen and (max-width: 1088px) {
	.agreement {
		margin: calc(100vw * 80 / 1088) 0 0;
    padding-bottom: 45px;
	}
	.agreement .term {
		font-size: calc(100vw * 14 / 1088);
	}
	.agreement .term .scroll {
		height: calc(100vw * 584 / 1088);
	}
	.agreement .note {
		font-size: calc(100vw * 11 / 1088);
	}
}
@media screen and (max-width: 599px) {
	.agreement {
		margin: calc(100vw * 65 / 750) 0 0;
		padding: 0 calc(100vw * 45 / 750) 45px;
	}
	.agreement .term {
		padding: calc(100vw * 45 / 750);
		font-size: inherit;
	}
	.agreement .term .scroll {
		height: 60vh;
	}
	.agreement .note {
		font-size: 11px;
		padding: calc(100vw * 45 / 750) 0 50px;
	}
}

.btPagetop,
.btPagetop:hover {
	box-sizing: border-box;
	padding: 0 38px 0 17px;
	position: fixed;
	right: 0;
	bottom: 0;
	z-index: +1;
	background: #fff url("../imgs/ico-pagetop.png") calc(100% - 18px) 50% / 10px no-repeat;
	color: #002a6f;
	font-size: 12px;
	line-height: 40px;
	transform: translateY(100%);
	transition: transform .5s;
}
.btPagetop.active {
	transform: translateY(0);
}
.btPagetop.fitToArticle {
	position: absolute;
}
@media screen and (max-width: 1088px) {
	.btPagetop,
  .btPagetop:hover {
		padding: 0 calc(100vw * 38 / 1088) 0 calc(100vw * 17 / 1088);
    background: #fff url("../imgs/ico-pagetop.png") calc(100% - 100vw * 18 / 1088) 50% / calc(100vw * 10 / 1088) no-repeat;
		font-size: calc(100vw * 12 / 1088);
		line-height: calc(100vw * 40 / 1088);
	}
}
@media screen and (max-width: 599px) {
	.btPagetop {
		padding: 0 38px 0 17px;
		background-position: calc(100% - 18px) 50%;
		background-size: 10px;
		font-size: 12px;
		line-height: 40px;
	}
}

#gFooter #CopyrightArea {
    margin-top: 0;
    padding-top: 30px 0;
    border-top: none;
}
.alpha a:hover img {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
}.txt_kodate {
	font-size: 10px;
}
