@charset "utf-8";


/* フェード設定 */

.fadein {
	transform : translate(0, 120vw);
	transition:all 0.9s;
}

.slide_left {
	transform : translate(-100vw, 0px);
	transition:all 0.9s;
}

.slide_right {
	transform : translate(100vw, 0px);
	transition:all 0.9s;
}


#PC { display: none !important; }
.pc { display: none !important; }

/*SPページの余白削除*/
#fftop_recomDetail section {
	padding: 0px;
}

tr, th, td, div {
	color: inherit;
}

/*クラブギフトの背景を白に*/
div#cgip {
	background-color: #fff;
}

.freeArea-direct {
	box-sizing: border-box;
	margin: 0px;
	padding: 0px;
	overflow: hidden;
}

/*all*/
#oshimen {
	max-width: 100%;
	text-align: center;
	font-family: 'noto-sans-cjk-jp', sans-serif;
	font-style: normal;
	font-feature-settings: "palt";
	background-image: url(../img/back.png);
	background-repeat: repeat;
	background-size: 100vw auto;
	background-position: top;
	position: relative;
	overflow: hidden;
	color: rgb(38,38,38);
	letter-spacing: 0.05em;
}

/*メインのタイトルロゴ*/
.title {
	width: 85vw;
	margin: 3.947vw auto;
	vertical-align: bottom;
}

/*右の葉っぱ*/
.leaf_back_right {
	width: 15.921vw;
	height: auto;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 9999;
}

/*左の葉っぱ*/
.leaf_back_left {
	width: 14.474vw;
	height: auto;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 9999;
}

/*最初のリードコピー*/
.body_copy {
	font-size: 4.5vw;
	line-height: 2;
	margin: 5vw auto;
	font-family: toppan-bunkyu-midashi-go-std, sans-serif;
	font-weight: 900;
	font-style: normal;
	word-spacing: -0.2em;
}

/*動物のプロフィール*/
.oshimen_profile {
	width: 92.105vw;
	background-color: #fff;
	border-radius: 6.579vw;
	margin: 0 auto;
	padding-bottom: 6.597vw;
}

/*動物のメイン画像（丸でキリヌキ）*/
.main_img {
	width: 65.789vw;
	border-radius: 32.895vw;
	margin: 6.579vw;
}

/*オレンジの帯の動物の名前*/
.animal_name {
	color: #fff;
	border-radius: 6.579vw;
	margin: 0 auto;
	font-size: 5.263vw;
	background-color: rgb(255,153,51);
	font-family: toppan-bunkyu-midashi-go-std, sans-serif;
	font-weight: 900;
	font-style: normal;
	margin-bottom: 3.947vw;
	padding: 0.2em 1em;
	display: inline-block;
}

/*動物園の名称*/
.zoo_name {
	font-size: 3.947vw;
	font-family: toppan-bunkyu-midashi-go-std, sans-serif;
	font-weight: 900;
	font-style: normal;
}

/*動物園の名称の横のアイコン*/
.zoo_name::before {
	content: '';
	display: inline-block;
	vertical-align: middle;
	background-size: contain;
	background-image: url(../img/spot_mark.png);
	background-repeat: no-repeat;
	width: 4.605vw;
	height: 5vw;
}


.zoo_name a {
	font-weight 700;
	color: rgb(38,38,38);
}

.animal_date {
	font-size: 3.947vw;
	line-height: 2;
	width: 78.947vw;
	background-color: rgb(246,246,246);
	border-radius: 3.947vw;
	margin: 0 auto;
	padding: 2vw;
	border-spacing: 1.5vw;
	font-family: 'noto-sans-cjk-jp', sans-serif;
}

.animal_date th {
	color: rgb(255,153,51);
	text-align: left;
	display: block;
	font-size: 4.2vw;
}

.animal_date tr {
	text-align: left;
	display: block;
}

.animal_date td {
	padding-bottom: 3vw;
}

/*推しPOINTのタイトル画像*/
.oshipoint_title {
	width: 85vw;
	margin: 0vw auto 3.947vw;
	vertical-align: bottom;
}

.contents_all {
	width: 92.105vw;
	background-color: #fff;
	border-radius: 6.579vw;
	margin: 4vw auto 0;
}

.oshipoint_img img {
	width: 78.947vw;
	border-radius: 3.947vw;	
	margin: 6.597vw auto 3.947vw;
}

.oshipoint_subimg {
	margin: 2vw auto;
	width: 78.947vw;
	border-radius: 3.947vw;	
}


/*推しPOINTのキャッチコピー*/
.oshipoint_catch {
	font-size: 5.263vw;
	line-height: 1.2;
	color: rgb(255,153,51);
	font-family: toppan-bunkyu-midashi-go-std, sans-serif;
	font-weight: 900;
	font-style: normal;
}

.oshipoint_copy {
	font-size: 3.947vw;
	line-height: 2;
	width: 72.368vw;
	margin: 0 auto 5em;
	text-align: justify;
	color: rgb(38,38,38);
}

.oshipoint_copy a {
	font-size: 3.947vw;
	text-decoration: underline;
}

.oshipoint_copy span {
	font-size: 3.2vw;
}

.oshipoint_catch span {
	font-size: 18px;
	font-weight: 600;
	font-size: 3.947vw;
	color: rgb(255,153,51);
}

span.caution {
	font-weight: 400;
	font-size: 3vw;
	color: rgb(255,153,51);
}

img.editors_message_title {
	width: 46.053vw;
	margin-top: 10vw;
}

/*担当者の名前*/
.pen_name {
	font-size: 3.947vw;
	font-family: toppan-bunkyu-midashi-go-std, sans-serif;
	font-weight: 900;
	font-style: normal;
	margin: 3.947vw auto;
}

/*編集後記のボディーコピー*/
.copy {
	font-size: 3.947vw;
	line-height: 2;
	text-align: justify;
	width: 72.368vw;
	margin: 0 auto;
}

.location_title {
	width: 85vw;
	margin: 9vw auto 3.947vw;
	vertical-align: bottom;
}



.location_contents {
	width: 92.105vw;
	margin: 0 auto;
	padding-bottom: 6.597vw;
}

/*アクセスの施設名*/
.location_zoo_name {
	font-size: 3.947vw;
	font-family: toppan-bunkyu-midashi-go-std, sans-serif;
	font-weight: 900;
	font-style: normal;
	margin: 3vw auto;
	border-radius: 3.947vw;
	border: solid 0.3vw rgb(38,38,38);
	padding: 0.5em 1em;
	display: inline-block;
}

.zoo_date {
	font-size: 3.947vw;
	line-height: 2;
	width: 78.947vw;
	border-radius: 3.947vw;
	margin: 0 auto 3.947vw;
	padding: 2vw;
	border-spacing: 1.5vw;
	font-family: 'noto-sans-cjk-jp', sans-serif;
	background-color: rgb(246,246,246);
	border-radius: 3.947vw;
}

.zoo_date th {
	color: rgb(255,153,51);
	text-align: left;
	display: block;
	font-size: 4.2vw;
}

.zoo_date td {
	padding-bottom: 3vw;
}


.zoo_date tr {
	text-align: left;
	display: block;
}

.zoo_btn img {
	width: 78.947vw;
	height: auto;
	margin: 0 auto;
	transition: all 0.9s;
}

.location_point {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.location_block {
	margin: 3.947vw;
}

.location_block p {
	font-size: 3.947vw;
	line-height: 2;
	text-align: justify;
	width: 72.368vw;
	color: rgb(38,38,38);
	margin: 0 auto;
}

.location_block .title {
	font-size: 4.2vw;
	font-weight: 700;
	color: rgb(255,153,51);
}

.location_block img {
	width: 50vw;
	border-radius: 25vw;
	margin: 10px auto;
}


.notes {
	width: 72.368vw;
	margin: 3.947vw auto;
	font-size: 3.947vw;
	line-height: 2;
	color: rgb(38,38,38);
	text-align: justify;
}

/* ボタン固定 */
#vpl_pagetop {
	position: fixed;
	right: 0px;
	left: 0px;
	bottom: 3vw;
	z-index: 9999999999999999999;
	display: none;
}

.zoo_btn img:active {
	transform: scale(1.1) !important;
	transition-duration: 0.3s;
}

.pagetop_btn {
	width: 24vw;
	height: auto;
	margin: 3.947vw auto;
}


.pagetop_btn:active {
	transform: scale(1.1) !important;
	transition-duration: 0.3s;
}



.pagetop_btn_new {
	width: 24vw;
	height: auto;
}


.pagetop_btn_new:active {
	transform: scale(1.1) !important;
	transition-duration: 0.3s;
}


/*バックナンバー*/
.backnumber {
	text-align: center;
}

.backnumber a {
	font-size: 5.5vw;
	font-weight: 800;
	border-radius: 6vw;
	border: solid 0.3vw #3399ff;
	display: inline-block;
	padding: 0.5em;
	text-decoration: none;
	color: #fff;
	background-color: #3399ff;
	margin: 3.947vw auto 17vw;
	width: 72.368vw;
	box-sizing: border-box;
	transition-duration: 0.3s;
	text-align: center;
}

.backnumber a:active {
	transform: scale(1.1) !important;
	transition-duration: 0.3s;
}

/*ゾウ*/
img.elephant {
    width: 55vw;
    position: absolute;
    left: -15vw;
    top: 27vw;
}

/*キリン*/
img.giraffe {
    width: 62vw;
    position: absolute;
    right: -30vw;
    top: 37vw;
}


/*カワウソ*/
img.kawauso {
    width: 34vw;
    position: absolute;
    left: 0vw;
    bottom: 0vw;
}

/*ペンギン*/
img.penguin {
	width: 17vw;
	position: absolute;
	right: -50vw;
	top: 6vw;
	z-index: 100;
	animation: walking 1.5s steps(8,start) 10s forwards;
}

@keyframes walking {
    0% {
        right:-50vw;
	transform: rotate(-5deg);
    }
    12.5% {
	transform: rotate(5deg);
    }
    25% {
	transform: rotate(-5deg);
    }
    37.5% {
	transform: rotate(5deg);
    }
    50% {
	transform: rotate(-5deg);
    }
    62.5% {
	transform: rotate(5deg);
    }
    75% {
	transform: rotate(-5deg);
    }
    87.5% {
	transform: rotate(5deg);
    }
    100% {
        right:-2vw;
	transform: rotate(0deg);
    }
}


/* ふりがな */
[data-ruby] {
    position: relative;
}

/* ふりがな */
[data-ruby]::before {
    content: attr(data-ruby);
    position: absolute;
    top: -1.7em;
    left: 0;
    right: 0;
    margin: auto;
    font-size: 2.5vw;
}