@charset "UTF-8";
/* CSS Document */

body {
    font-family: '游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic', 'メイリオ', sans-serif; 
    font-weight: 500;
    position:relative;
}
sub {
    position: relative;  
    bottom: -.4em;  
    vertical-align: bottom;
}
.copyBlock p sub {
    font-size:80%;
}
#gallaryTravel figcaption sub {
    font-size:86%;
    bottom: -.1em;
}
sup {
font-size:70%;
vertical-align: super;
}



/* ------------------------------ *
	SNSボタン
 * ------------------------------ */
div.snsWrap{ padding:0 0 15px; }
.social_buttons{ list-style-type: none; text-align: left; margin: 0; padding: 0; *zoom: 1; }
.social_buttons:before, .social_buttons:after{ content: ""; display: table; clear: both; }
.social_buttons li{ float:left; margin-left: 0; margin-right: 10px; font-size:12px; }
.social_buttons li:last-child{ margin-right: 0; }
.social_buttons li .fb_iframe_widget > span{ vertical-align: baseline; }



/* ------------------------------ *
	Object-fit IE対策
 * ------------------------------ */
.object-fit-img {
  object-fit: cover;
  font-family: 'object-fit: cover;'; /*object-fit　IE11対策*/
}
li.botttrm .object-fit-img {
    object-position: 50% bottom;
}


.row {
    width:960px;
    margin-left: auto;
    margin-right: auto;
}
.flxbox {
    display: flex;
    justify-content: space-between;
}
.spOnly {
    display: none;
}

main {
    color: #333333;
    font-size: 18px;
}
.rubi {
    font-size: 80%;
}

/* Top Title Area */

section#topTitArea {
    margin-bottom: 6em;
}
#topImage {
    margin-bottom: 0em;
}
#topImage ul {
    list-style: none;
    height: 100%;
}
#topImage ul li {
    height:568px;
}

#headerSpecial {
	height: 80px;
	background-image: url(logo_bg.jpg);
	background-repeat: repeat-x;
	background-size: auto 100%;
}
#headerSpecial .logobase {
    padding-left: 1em;
}

#topTitArea h1#topTit {
    width:960px;
    margin-bottom: 0em;
    margin-left: auto;
    margin-right: auto;
}
#leadCopyArea {
    width: 960px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    align-items: center;
}
#leadCopyArea h2 {
    padding-left: 1em;
    font-size: 118%;
    line-height: 160%;
    font-weight: 500;
}



/*Main Content*/

.copyBlock {
    margin-bottom: 4em;
}
.copyBlock.Atype {
    width: 640px;
    margin-left: auto;
    margin-right: auto;
}
.copyBlock.Ctype {
    margin-bottom: 1em;
}
.copyBlock.Btype, .copyBlock.Ctype {
    width: 800px;
    margin-bottom: 2em;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    justify-content: space-between;
}
.copyBlock.Dtype {
    width: 800px;
    margin-left: auto;
    margin-right: auto;
}
.copyBlock.Btype p, .copyBlock.Ctype p {
    width: 480px;
}
.copyBlock.Btype figure.portlate {
    width: 270px;
    margin-top: 0.8em;
}
.copyBlock.Ctype figure.portlate {
    width: 270px;
    margin-top: 0.4em;
}
.copyBlock figure.portlate p {
    font-size: 75%;
    line-height: 140%;
    margin-bottom: 0.4em;
}
.copyBlock figure.portlate h5.castName {
    font-size: 134%;
    font-weight: 500;
    font-feature-settings: "palt" 1;
}
.copyBlock.Btype figure.portlate h5.castName span {
    font-size: 70%;
    margin-left: 0.2em;
}
.copyBlock h3 {
    margin-bottom: 0.4em;
    font-size: 156%;
    font-weight: 500;
}
.copyBlock p {
    font-size: 100%;
    line-height: 212%;
    text-align: justify;
    text-justify: inter-ideograph; /* IEで必要 */
    text-justify: inter-character; /* Firefoxで必要 */
}
.photoBlock {
    width: 800px;
    margin-bottom: 2em;
    margin-left: auto;
    margin-right: auto;
}
.photoBlock figure {
    margin-bottom: 1em;
    display:table;
}
.photoBlock figcaption {
    font-size: 75%;
    display:table-caption; 
    caption-side:bottom;
}


/* Profile */
#profileArea {
	margin-bottom: 4em;
	padding: 1em;
	background-color: #EAEAEA;
	display: flex;
	align-items: center;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#profileAreaShort {
	width:800px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom: 4em;
	padding: 1em;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	background-color: #EAEAEA;
	display: flex;
	align-items: center;
	justify-content:center;
}
#profileArea img {
    margin-left: 1em;
    margin-right: 1em;
}
#profileAreaShort img {
    margin-left: 1em;
}
#profileArea .profileBlock {
    width:34%;
}
#profileAreaShort .profileBlock {
    width:434px;
}
#profileArea .profileBlock p,  #profileAreaShort .profileBlock p {
    font-size: 75%;
    text-align: justify;
}
#profileArea .profileBlock h5.castName,  #profileAreaShort .profileBlock h5.castName  {
    font-size: 124%;
    font-weight: 500;
    font-feature-settings: "palt" 1;
}
#profileArea .profileBlock h5.castName span,  #profileAreaShort .profileBlock h5.castName span {
    font-size:70%;
    margin-left: 0.2em;
}

/* SNS BOX */

.sns_box {
    width: 960px;
    margin-bottom: 4em;
    margin-left: auto;
    margin-right: auto;
    padding-bottom:0.2em;
    padding-top:0.6em;
    border-bottom: thin solid #707070;
    border-top: thin solid #707070;
}

/* Video Area */
#videoArea {
    display: flex;  
    align-items: center;  
    justify-content: space-between;
    margin: 0 auto 4em auto;  
    color: #727171;  
    background-color: #DFE7ED;
}
#videoArea .videoLeft{
    padding-left: 2em;
}
#videoArea .videoLeft h3 {
    font-family: YuMincho, /* Mac用 */'Yu Mincho', /* Windows用 */serif;  
    font-weight: 600;  
    line-height: 200%; 
    font-feature-settings: 'palt';
    font-size: 140%;
}
#videoArea .videoRight img {
    vertical-align: bottom;
}


/* Special Calam */
#calamSpcial {
    margin-bottom: 3em;
    background-color: #ECEBE1;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#calamSpcial .titArea {
    padding-bottom: 0.2em;
    padding-top: 0.2em;
    color:#fff;
    background-color: #72706B;
    display: flex;
    justify-content: center;
    align-items: center;
}
#calamSpcial .titArea h2 {
    font-size: 250%;
    font-weight: 500;
}
#calamSpcial .titArea p {
    margin-right: 1em;
    margin-bottom: -0.6em;
    font-size: 125%;
}
#calamSpcial .contentsArea {
	padding: 1.4em;
	overflow-x: hidden;
}
#calamSpcial .contentsArea figure.cBlockImg {
    width:38%;
    margin-bottom: 1em;
    margin-right: 1.4em;
    margin-top: 0.6em;
}
#calamSpcial .contentsArea .Atype p {
    width:60%;
}
#calamSpcial .contentsArea figure figcaption {
    font-size: 75%;
}
#calamSpcial .calamBlock p {
    line-height: 212%;
}
#calamSpcial #sliderArea {
    margin-bottom: 3em;
    padding-top: 3em;
}
#calamSpcial .btnLink {
    margin-bottom: 2em;
    text-align: center;
    font-size: 112%;
}
#calamSpcial .btnLink a {
    color: #333;
    text-decoration: none;
}


/* Travel Spot */
#spotTravel p.leadSpot {
    margin-bottom: 3em;
    text-align: center;
}
h4.titShoulder {
    width: 32%;
    margin-left: auto;
    margin-bottom: 1em;
    margin-right: auto;
    padding-bottom: 0.4em;
    padding-top: 0.4em;
    font-size: 75%;
    font-weight: 500;
    border: thin solid #707070;
    text-align: center;
}
h3.titSect {
    margin-bottom: 1em;
    text-align: center;
    font-size: 188%;
    font-weight: 500;
}
#spotTravel ul#spotBox {
    margin-bottom: 3em;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
#spotTravel ul#spotBox li {
    width: 30.8%;
    margin-bottom: 2em;
}
#spotTravel ul#spotBox li h5 {
    margin-bottom: 0.4em;
    font-size: 112%;
    font-weight: 500;
}
#spotTravel ul#spotBox li p.bodySpot {
    font-size: 88%;
    text-align: justify;
    text-justify: inter-ideograph; /* IEで必要 */
    text-justify: inter-character; /* Firefoxで必要 */
}
#spotTravel ul#spotBox li p.comment {
    font-size: 75%;
}
#spotTravel ul#spotBox li img {
    margin-bottom: 0.6em;
}


/* Gallary Travel */
#gallaryTravel {
    padding-bottom: 6em;
}


/* Information */
#Information {
    margin-bottom: 6em;
}
#Information h3.titInfor {
    margin-bottom: 2em;
    font-weight: 500;
    font-size: 150%;
    text-align: center;
}
ul#linkArea {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
ul#linkArea li {
    width:40%;
    margin-bottom: 1em;
    text-align: center;
}
ul#linkArea li a {
    color: #333;
    text-align: center;
}
ul#linkArea li a:hover {
    text-decoration: none;
}


/* Product */
#productionArea {
    padding-bottom: 2em;
    padding-top: 2.4em;
    color: #fff;
    background-color: #000;
    position: relative;
    z-index: 8000;
}
#productionArea .productPhoto {
    margin-right: 2em;
    padding-top: 0em;
}
#productionArea #productCopy {
    width: 42%;
}
#productionArea #productCopy ul.speckProduct {
    margin-bottom: 1em;
    margin-right:-1em;
    padding-left:1.2em;
    font-size: 75%;
}
#productionArea h4#productName {
    margin-bottom: 0.2em;
    font-family: 'Helvetica Black', 'Arial Black', 'sans-serif';
    font-size: 280%;
    font-weight: 900;
    line-height: 110%;
}
#productionArea .btnLinkProduct a {
    margin-bottom: 0.6em;
    padding-bottom: 0.6em;
    padding-top: 0.6em;
    display: flex;
    color: #fff;
    border:thin solid #777;
    border-radius: 0.2em;
    text-decoration: none;
    position: relative;
    justify-content: center;
    align-items: center;
}
#productionArea .btnLinkProduct a:hover {
    background-color: #333;
}
#productionArea .btnLinkProduct a i {
    margin-top:-12px;
    position: absolute;
    right: 0.6em;
    top:50%;
}
p.coutionCopy, p.callFaq {
    font-size: 75%;
}
p.coutionCopy {
    margin-bottom: 0.6em;
    padding-bottom: 0.4em;
    border-bottom: thin solid #777;
}
.speckIndentPC {
    margin-left:4.5em;
}


/* Footer */
footer#footerTrue {
    padding-bottom: 2em;
    padding-top: 2em;
    color: #fff;
    background-color: #000;
    border-top: 4px solid #fff;
    position: relative;
    z-index: 8000;
}
footer#footerTrue p {
    text-align: center;
    font-size: 75%;
}


/* Bottom Menu Fixed */
#bottomMenu {
    width: 100%;
    position: fixed;
    bottom: 0;
    left:0;
    z-index: 4000;
}
#bottomMenu #tagBackNumb {
	width: 18em;
	margin-bottom: -3px;
	margin-left: 2em;
	padding-bottom: 0.6em;
	padding-top: 0.6em;
	color: #fff;
	font-size: 88%;
	text-align: center;
	vertical-align: bottom;
	background-color: #333;
	border-left: 3px solid #fff;
	border-right: 3px solid #fff;
	border-top: 3px solid #fff;
	position: relative;
	z-index: 6000;
}
#bottomMenu #tagBackNumb:hover {
    cursor: pointer;
}
#bottomMenu #tagBackNumb i {
	position: relative;
    top:4px;
    left:-6px;
}
#bottomMenu .baseMenu {
    padding-top: 0.6em;
    color: #fff;
    background-color: #333;
    border-top: 3px solid #fff;
    position: relative;
    z-index: 4000;
}
#bottomMenu .hideMenu {
    display: none;
}
#bottomMenu .hideMenu .flxbox {
    justify-content: flex-start;
}
#bottomMenu .hideMenu ul.bnList {
	height: 380px;
	padding-top: 2em;
	padding-right: 2em;
	list-style: none;
	overflow-y: scroll;
    direction:rtl;
}
#bottomMenu .hideMenu ul.bnList::-webkit-scrollbar {
    padding-top: 2em;
    width: 8px;
}
#bottomMenu .hideMenu ul.bnList::-webkit-scrollbar-track {
    background: #333;
}
#bottomMenu .hideMenu ul.bnList::-webkit-scrollbar-thumb {
	background: #444;
    border-radius: 4px;
}
#bottomMenu .hideMenu ul.bnList li {
    margin-bottom: 1em;
    margin-left: 1em;
    direction:ltr;
text-align: left;
}
#bottomMenu .hideMenu ul.bnList li a {
    display: flex;
    color: #fff;
    text-decoration: none;
    align-items: center;
    opacity: 0.5;
}
#bottomMenu .hideMenu ul.bnList li a:hover {
    opacity: 1;
}
#bottomMenu .hideMenu ul.bnList li a img {
    margin-right: 1em;
}
.bnTitle p.bnArea {
    font-size: 84%;
}
.bnTitle p.bnContent{
    font-size: 168%;
}
#bottomLink {
    border-top: 4px solid #fff;
    background:linear-gradient(90deg,#000 0%,#000 50%,#333 50%,#333 100%);
}
#bottomLink ul {
    list-style: none;
}
#bottomLink ul li {
	width: 50%;
	padding: 0.6em;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#bottomLink ul li#realTabi {
    border-left: 4px solid #fff;
}
#bottomLink ul li a {
    display: flex;
    align-items: center;
    text-decoration: none;
    justify-content: center;
}
#bottomLink ul li a p {
    margin-right: 1em;
    color: #fff;
    font-size: 75%;
}


/* CF Bunner Area */
.spcBunner {width:640px;margin:0em auto 4em auto;padding:1.8em 0em .8em 0em;background-color:#eee;text-align:center;box-sizing: border-box;border-radius: 1em;}
.spcBunner h3 {width:100%;margin:.4em auto;padding:.3em 0;font-size:112%;font-weight:700;letter-spacing:.1em;color:#fff;line-height:1.4;background-color:#ffbd2e;border-bottom:2px solid #cc9725;}
.spcBunner h4 {margin-bottom:.6em;font-size:156%;font-weight:700;letter-spacing:.1em;}
.spcBunner .btnSpc a {width:14em;height:1.875em;margin:0em auto 1.4em;color:#000;font-size:89%;font-weight:400;letter-spacing:.1em;display:flex;justify-content:center;align-items:center;text-decoration: none;border:thin solid #777;border-radius: 8px;background-color: #fff;}
.spcBunner .btnSpc a:hover {color:#fff;background-color:#777;}
.spcBunner p.annotation {font-size:78%;}
@media screen and (max-width: 896px) {
    .spcBunner {width:100%;}
}
@media screen and (max-width: 738px) {
    .spcBunner h3 {width:100%;}
    .spcBunner img {width:80%;height:auto;}
    .spcBunner p.annotation {margin:0 1em;text-align:left;}
    .spcBunner p.annotation br {display:none;}
}

/* CF Bunner another plan */
.spcBunner2 {width:640px;margin:0em auto 4em auto;}
.spcBunner2 img.bunnSP {display:none;}
.spcBunner2 img {width:100%;height:auto;}
.spcBunner2 a:hover img {opacity: 0.6;}
@media screen and (max-width: 738px) {
    .spcBunner2 img.bunnSP {display:block;}
    .spcBunner2 img.bunnPC {display:none;}
}

/* Link JAL */
section#jalLink {max-width:640px;margin:3em auto 8em auto;}
section#jalLink a {padding:.6em;text-decoration: none;color: inherit;display:flex;align-items:center;border:2px solid #eee;}
section#jalLink a:hover {background-color: #DFE3E6;border:2px solid #DFE3E6;}
section#jalLink a img {width:240px;height:auto;margin-right:.8em;}
section#jalLink a p {text-align:left;margin-right:.4em;}
section#jalLink a h3 {margin-bottom:.4em;font-weight: 400;font-size:1.5rem;}
@media screen and (max-width: 738px) {
    section#jalLink a img {width:40vw;}
    section#jalLink a h3 {font-size: 4.8vw;}
}

/* LInk JAL 2 */
section#jalLink2 {max-width:480px;margin:3em auto 8em auto;}
section#jalLink2 a {padding:1em;text-decoration: none;text-align:center;color: inherit;display:flex;background-color: #f8f8f8;flex-direction: column;justify-content: center;border:2px solid #ddd;}
section#jalLink2 a:hover {background-color: #fff;}
section#jalLink2 a img {width:400px;height:auto;margin:0 auto 1em auto;}
section#jalLink2 a h3 {margin-bottom:0em;font-weight: 400;font-size:1.5rem;}
section#jalLink2 a p {margin-bottom:.2em;}
@media screen and (max-width: 738px) {
    section#jalLink2 {width:90vw;margin-left:auto;margin-right:auto;}
    section#jalLink2 a {margin:0;padding:0;}
    section#jalLink2 a img {width:76vw;margin-top:.8em;}
    section#jalLink2 a h3 {font-size: 4.8vw;}
}

/* LInk JAL 3 */
section#jalLink3 {margin:3em auto 8em auto;}
section#jalLink3 a {width:480px;height:172px;padding:.6em 1em;margin:auto;text-decoration: none;text-align:left;color: inherit;background-color: #f8f8f8;border:2px solid #ddd;position:relative;display:block;box-sizing: border-box;}
section#jalLink3 a:hover {background-color: #fff;}
section#jalLink3 a img {width:400px;height:auto;margin-left:-200px;position:absolute;bottom:1em;left:50%;}
section#jalLink3 a h3 {margin-bottom:0em;font-weight: 400;font-size:1.5rem;}
section#jalLink3 a p {margin-bottom:.2em;}
@media screen and (max-width: 738px) {
    section#jalLink3 {margin-left:auto;margin-right:auto;}
    section#jalLink3 a {width:90vw;height:36vw;margin:0;}
    section#jalLink3 a img {width:76vw;margin-top:.8em;margin-left:-38vw;}
    section#jalLink3 a h3 {font-size: 4.8vw;}
}

/* Link JAL 4 */
section#jalLink4 {margin:3em auto 8em auto;}
section#jalLink4 a {width:480px;height:224px;padding:.4em .8em;margin:auto;text-decoration: none;text-align:left;color: inherit;box-sizing: border-box;display:block;background-image:url(jta737b.jpg);background-size:cover;background-position:center center;border:2px solid #ddd;}
section#jalLink4 a:hover {opacity:.6;}
section#jalLink4 a h3 {margin-bottom:0em;font-weight:700;font-size:1.5rem;text-shadow:1px 1px 2px rgba(255, 255, 255, 1);}
section#jalLink4 a p {margin-bottom:.2em;font-weight:700;letter-spacing:.1em;text-shadow:1px 1px 2px rgba(255, 255, 255, 1);}
@media screen and (max-width: 738px) {
    section#jalLink4 {margin-left:auto;margin-right:auto;}
    section#jalLink4 a {width:90vw;height:42vw;margin:0;}
    section#jalLink4 a img {width:76vw;margin-top:.8em;margin-left:-38vw;}
    section#jalLink4 a h3 {font-size: 4.8vw;}
}