@charset "utf-8";

/* -----------------------------------------------------------------
 special_heading
----------------------------------------------------------------- */
.special_heading {
  height: 690px;
  position: relative;
  padding: 0 30px;
	background:url(/special/img/heading_bg_pc.jpg) no-repeat center top;
}
.special_heading  .box_text {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform : translate(-50%,-50%);
  transform : translate(-50%,-50%);
  text-align: center;
  width: 94%;
  color: #fff;
}
.special_heading .box_text .effect_fade {
  position: relative;
}
.special_heading .box_text .bt_ttl {
	font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
	font-size: 2.1em;
	letter-spacing: 0.3em;
	line-height: 1.5;
	text-shadow: 0px 0px 5px rgba(1, 86, 130, 0.5);
}
.special_heading .box_text .bt_text {
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  font-size: 0.83em;
  line-height: 2.26;
  margin: 15px 0 0 0;
  letter-spacing: 0.22em;
 	text-shadow: 0px 0px 5px rgba(1, 86, 130, 0.5);
}
@media(max-width: 768px){
  .special_heading {
    height: auto;
    padding:110.66% 15px 0 15px;
    background:url(/special/img/heading_bg_sp.jpg) no-repeat center top;    
    background-size: 100% auto;
  }
  .special_heading .box_text {
    padding-bottom: 5px;
  }
  .special_heading .box_text .bt_ttl {
    letter-spacing: 0.2em;
    line-height: 1.4;
  }
  .special_heading .box_text .bt_text {
    font-size: 1em;
    line-height: 2;
    margin: 7px 0 0 0;
    letter-spacing:normal;
  }
}
/*---------- .breadcrumb ----------*/
.special_heading .breadcrumb {
  position: absolute;
  top:0;
  left: 0;
}
.special_heading .breadcrumb li {
	color: #fff;
}
.special_heading .breadcrumb li a {
	color: #fff;
}
.special_heading .breadcrumb li a::after {
	background:#fff;
}
.special_heading .breadcrumb li:nth-child(n+2) {
	background: url("/common/img/arrow_standard_white.svg") left 0.5em center no-repeat;
	background-size: .8em .8em;
}



/* -----------------------------------------------------------------
 box_diary
----------------------------------------------------------------- */
.box_diary {
	min-height:177.07vw;
	margin-top:-1.6vw;
	background:url(/special/img/diary_bg_sp.jpg) no-repeat center top;
	background-size:100% auto;
}
.box_diary .ttl {
	width:46.93vw;
	padding-top:31.2vw;
	margin-left:45.47vw;
}

@media screen and (min-width: 768px) {
.box_diary {
	min-height:calc((100vw - 240px) * .408);
	margin-top:0;
	background:url(/special/img/diary_bg_pc.jpg) no-repeat center top;
	background-size:100% auto;
}
.box_diary .ttl {
	width:calc((100vw - 240px) * .1713);
	padding-top:calc((100vw - 240px) * .0637);
	margin-left:calc((100vw - 240px) * .565);
}
}
@media screen and (min-width: 1024px) {
	.box_diary {
	min-height:calc((100vw - 280px) * .408);
}
.box_diary .ttl {
	width:calc((100vw - 280px) * .1713);
	padding-top:calc((100vw - 280px) * .0637);
	margin-left:calc((100vw - 280px) * .565);
}
}

/*---------- btn ----------*/
.box_diary .btn {
	width:46.93vw;
	margin-top:5.3vw;
	margin-left:45.47vw;
}
.box_diary .btn a {
	display:flex;
	justify-content: center;
	align-items: center;
	padding:1.3em .5em;
	border:#0583bb 1px solid;
	background:#fff;
	font-size:1.07em;
	color:#0583bb;
}
.box_diary .btn a::after {
	content:"";
	display:block;
	width:1.2em;
	height:1.2em;
	margin-left:0.3em;
	background:url(/special/img/arrow_standard_blue.svg) no-repeat right center;
	background-size:contain;
}
@media screen and (min-width: 768px) {
.box_diary .btn {
	width:calc((100vw - 240px) * .1713);
	margin-top:1.5em;
	margin-left:calc((100vw - 240px) * .565);
}
.box_diary .btn a {
	padding:1em .5em;
	font-size:.83em;
	transition:all .3s ease;
}
.box_diary .btn a:hover {
	background:#0583bb;
	color:#fff;
}
.box_diary .btn a:hover::after {
	content:"";
	background:url(/special/img/arrow_standard_white.svg) no-repeat right center;
	background-size:contain;
}


}
@media screen and (min-width: 1024px) {
.box_diary .btn {
	width:calc((100vw - 280px) * .1713);
	margin-left:calc((100vw - 280px) * .565);
}
}


/* -----------------------------------------------------------------
 box_picturebook
----------------------------------------------------------------- */
.box_picturebook {
	position:relative;
	padding-bottom:calc(6.1vw + 2.5em);
	background:url(/special/img/picturebook_bg.jpg) repeat center center;
	background-size:contain;
}
.box_picturebook::before {
	content:"";
	display:block;
	width:100vw;
	height:6.1vw;
	background:url(/special/img/picturebook_mask.svg) no-repeat center top;
	background-size:102% auto;
}
.box_picturebook::after {
	position:absolute;
	content:"";
	display:block;
	bottom:-1px;
	width:100vw;
	height:6.1vw;
	background:url(/special/img/picturebook_mask.svg) no-repeat center top;
	background-size:102% auto;
	transform:rotate(180deg);
}
.box_picturebook .ttl {
	width:85.33vw;
	padding-top:12vw;
	margin-left:auto;
	margin-right:auto;
}
.box_picturebook .copy {
	margin-top:1.4em;
	text-align:center;
	font-weight:bold;
	font-size:1.07em;
	color:#266ec1;
}
@media screen and (min-width: 768px) {
.box_picturebook {
	margin-top:3.4em;
	padding-bottom:6.1vw;
}
.box_picturebook::before {
	width:calc(100vw - 240px);
}
.box_picturebook::after {
	width:calc(100vw - 240px);
}
.box_picturebook .ttl {
	width:328px;
	padding-top:4em;
}
.box_picturebook .copy {
	margin-top:1.4em;
	letter-spacing: .3em;
	line-height: 1.6;
	font-size:.83em;
	color:#266ec1;
}
}
@media screen and (min-width: 1024px) {
.box_picturebook::before {
	width:calc(100vw - 280px);
	height:calc((100vw - 280px) * .061);
}
.box_picturebook::after {
	width:calc(100vw - 280px);
}
}


/*---------- list ----------*/
.box_picturebook ul.list {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 94%;
	margin-top:1.3em;
	margin-left: auto;
	margin-right: auto;
	transition:all .3s ease;
}
.box_picturebook ul.list li {
	width:calc((100% - 3%) / 2);
	margin-top:1em;
	opacity:1;
	cursor:pointer;
}
.box_picturebook ul.list li.hide{
	display:none;
	height:0;
	width:0;
}
.box_picturebook ul.list li figure .img {
	position:relative;
	display:inline-block;
}
.box_picturebook ul.list li figure .img::after{
	z-index:1;
	position:absolute;
	content:"";
	bottom:0;
	right:0;
	width:27%;
	height:27%;
	background:url(/special/img/ico_zoom.png) no-repeat center top;
	background-size:contain;
}
.box_picturebook ul.list li figure .img img{
	width:100%;/*IE11*/
	border:#d1ebf5 .5em solid;
	border-radius:50%;
}
.box_picturebook ul.list li figcaption{
	line-height:1.2;
	text-align:center;
	font-weight:bold;
	font-size:1.43em;
	color:#266ec1;
}
.box_picturebook .not_found {
	display: flex;
	justify-content: center;
	align-items: center;
	width:90%;
	height:15em;
	margin:auto;
	text-align:center;
	font-weight:bold;
	color:#266ec1;
}
.box_picturebook .not_found.hide {
	display:none;
}

@media screen and (min-width: 768px) {
.box_picturebook ul.list {
	justify-content: flex-start;
}
.box_picturebook ul.list li {
	width:calc(99% / 4 - 1em);/* IE11対策で99% */
	margin-left:.5em;
	margin-right:.5em;
}
.box_picturebook ul.list li:hover figure .img img{
}

.box_picturebook ul.list li figure .img{
}
.box_picturebook ul.list li figure .img::before{
	z-index:1;
	position:absolute;
	content:"";
	bottom:0;
	right:0;
	width:100%;
	height:100%;
	border:transparent 2px dashed;
	border-radius:50%;
	transition:all .6s ease;
	animation: rotation 8s infinite linear;
}
.box_picturebook ul.list li:hover figure .img::before{
	border:#266ec1 2px dashed;
}
.box_picturebook ul.list li figure .img::after{
	bottom:5%;
	right:5%;
	width:20%;
	height:20%;
}
.box_picturebook ul.list li figcaption{
	font-size:1.27em;
}
@keyframes rotation {
from {transform: rotate(0deg);}
to {transform: rotate(360deg);}
}



}
@media screen and (min-width: 1024px) {
.box_picturebook ul.list li {
	width: calc(99% / 5 - 1em);/* IE11対策で99% */
}
}
@media screen and (min-width: 1400px) {
}
@media screen and (min-width: 1600px) {
.box_picturebook ul.list {
	max-width:1500px;
}
.box_picturebook ul.list li {
	width:calc(99% / 6 - 2em);/* IE11対策で99% */
	margin-left:1em;
	margin-right:1em;
}
}




/*---------- btn ----------*/
.box_picturebook .btn a {
	display:flex;
	justify-content: center;
	align-items: center;
	margin-top:1.5em;
	padding:1em .5em;
	border:#266ec1 1px solid;
	font-size:1.25em;
	color:#266ec1;
}
.box_picturebook .btn a::after {
	content:"";
	display:block;
	width:1.2em;
	height:1.2em;
	margin-left:0.3em;
	background:url(/special/img/arrow_standard_blue02.svg) no-repeat right center;
	background-size:contain;
}
@media screen and (min-width: 768px) {
.box_picturebook .btn a {
	width:18em;
	margin-top:4em;
	margin-left: auto;
	margin-right: auto;
	padding:.8em .5em;
	font-size:.83em;
	transition:all .3s ease;
}
.box_picturebook .btn a:hover {
	background:#266ec1;
	color:#fff;
}
.box_picturebook .btn a:hover::after {
	content:"";
	background:url(/special/img/arrow_standard_white.svg) no-repeat right center;
	background-size:contain;
}
}


/* -----------------------------------------------------------------
 box_sightseeing
----------------------------------------------------------------- */
.box_sightseeing {
	margin-top:4.1em;
}

/*bs_ttl*/
.box_sightseeing .bs_ttl {
	text-align:center;
    font-size:2.33em;
	font-family: "Sorts Mill Goudy", "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
	color:#011952;
  letter-spacing: 0.2em;
}
.box_sightseeing .bs_copy {
	text-align:center;
	font-family: "Sorts Mill Goudy", "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
	color:#011952;
  font-size:.1.2em;
  margin: 15px 0 0 0;
}
@media screen and (min-width: 768px) {
  .box_sightseeing .bs_ttl {
  }
  .box_sightseeing .bs_copy {
    line-height:1.8;
    font-size:.83em;
  }
}

/*---------- btn ----------*/
.box_sightseeing .btn a {
	display:flex;
	justify-content: center;
	align-items: center;
	margin-top:1.5em;
	padding:1em .5em;
	border:#4b4948 1px solid;
	font-size:1.25em;
	color:#4b4948;
}
.box_sightseeing .btn a::after {
	content:"";
	display:block;
	width:1.2em;
	height:1.2em;
	margin-left:0.3em;
	background:url(/common/img/arrow_standard_black.svg) no-repeat right center;
	background-size:contain;
}
@media screen and (min-width: 768px) {
  .box_sightseeing .btn a {
    width:18em;
    margin-top:4em;
    margin-left: auto;
    margin-right: auto;
    padding:.8em .5em;
    font-size:.83em;
    transition:all .3s ease;
  }
  .box_sightseeing .btn a:hover {
    background:#89bfdb;
    border:#89bfdb 1px solid;
    color:#fff;
  }
  .box_sightseeing .btn a:hover::after {
    content:"";
    background:url(/special/img/arrow_standard_white.svg) no-repeat right center;
    background-size:contain;
  }
}

/*swiper_sightseeing----------------------------------- */
.swiper_sightseeing .swiper-wrapper {
  padding: 25px 0;
}
@media screen and (min-width: 769px) {
  .swiper_sightseeing .swiper-slide {
    width: 460px !important;
  }  
}



/* -----------------------------------------------------------------
 box_aquadiary
----------------------------------------------------------------- */
.box_aquadiary {
	background:url(/special/img/diary_bg.jpg) no-repeat center center;
	background-size:cover;
  height: 670px;
  position: relative;
}
.box_aquadiary .box_ttl {
  position: absolute;
  top:80px;    
  right: 24%;
}
.box_aquadiary .box_ttl .ttl {
  text-align: right;
}
.box_aquadiary .box_ttl .ttl img {
  width: 132px;
  display: inline;
}
.box_aquadiary .box_ttl .text {
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  margin: -70px 0 40px  0;
  padding: 0 80px 0 0;
  height: 190px;
  font-weight: bold;
  color: #0583bb;
  letter-spacing: 0.28em;
  line-height: 2;
  font-size: 0.94em;
  width: 100%;
}
.box_aquadiary .box_ttl .btn a {
  font-size: 1em;
  display: block;
  width: 100%;
	padding:15px 10px;
	border:#0583bb 1px solid;
  text-align: center;
	color:#0583bb;
}
.box_aquadiary .box_ttl .btn a::after {
	content:"";
	display:inline-block;
	width:1.2em;
	height:1.2em;
	margin-left:0.3em;
	background:url(/special/img/arrow_standard_blue.svg) no-repeat right center;
	background-size:contain;
  vertical-align: middle;
}
@media screen and (min-width: 769px) {
  .box_aquadiary .box_ttl .btn a {
    font-size:0.83em;
    transition:all .3s ease;
  }
  .box_aquadiary .box_ttl .btn a:hover {
    background:#0583bb;
    border:#0583bb 1px solid;
    color:#fff;
  }
  .box_aquadiary .box_ttl .btn a:hover::after {
    content:"";
    background:url(/about/img/arrow_standard_white.svg) no-repeat right center;
    background-size:contain;
  }
}
@media screen and (max-width: 1300px) {
  .box_aquadiary .box_ttl {
    right: 10%;
  }
}
@media screen and (max-width: 768px) {
  .box_aquadiary {
    margin: 10% 0;
    background:url(/special/img/diary_bg_sp.jpg) no-repeat center center;
    background-size:cover;
    height:auto;
    padding-top: 108%;
  }
  .box_aquadiary .box_ttl {
    top:2%;
    right: 8%;
  }
  .box_aquadiary .box_ttl .ttl img {
    width: 40%;
  }  
  .box_aquadiary .box_ttl .text {
    line-height: 1.53;
    margin: -26% 0 10%  0;
    padding: 0 20% 0 0;
    height: auto;
  }
  .box_aquadiary .box_ttl .btn a {
    float: right;
    width: auto;
    padding:10px 15px;
  }  
}