@charset "utf-8";

/* ------------------------------------------------------------------------------------
 header
------------------------------------------------------------------------------------ */

@font-face {
	font-family: 'MyFont';
	src:url('../fonts/NK_Mono.ttf');
}

#logo_image .logo a img {opacity: 1; transition: 0.5s;}
#logo_image .logo a img:hover {opacity: 1.0;}

#logo_image .logo {width: 100%; position: relative; overflow: hidden;}
#logo_image .logo::before {
	position: absolute;
    top: 0;
    left: -100%;
    bottom: 0;
    margin: auto 0;
    width: 100px;
    height: 200%;
    content: "";
    background: linear-gradient(to right, #fff, #fff 10%, transparent 10%, transparent 20%, #fff 20%, #fff 90%, transparent 90%, transparent 94%, #fff 94%);
    opacity: 0.3;
    transform: translate(-50%) rotate(45deg);
    transition: left 0.4s ease-in, transform 0.4s ease-in;
}
#logo_image .logo:hover::before {
	left:150%;
	transform:translate(50%) rotate(45deg);
	transition-timing-function:ease-out, ease-out;
}

h1.logo a:hover {text-decoration: none;}

#header .container {height: 80px;}
@media only screen and (max-width:1230px){#header .container {height: 70px;}}

#logo_image .logo .mobile_logo_image {display:none;}
#logo_image .logo .mobile_logo_image2 {display: none;}

@media only screen and (max-width:1199px){
	#logo_image .logo .pc_logo_image {display: none;}
	#logo_image .logo .mobile_logo_image {display: block; width: 100%;}
	#logo_image .logo .mobile_logo_image2 {display: none;}
}
@media only screen and (max-width:767px){
	#logo_image .logo .mobile_logo_image {display: none;}
	#logo_image .logo .mobile_logo_image2 {display: block; width: 100%;}
	#header .container {height: 60px;}
	.header-col-15 .button_maru {position: absolute; right: 80px; width: 30px; height: 30px;}
	.header-col-15 .sld_map {right: 200px;}
	.header-col-15 .sns_fb {right: 160px;}
	.header-col-15 .sns_tw {right: 120px;}
	.header-col-15 .sns_ig {right: 80px;}
}



/* ------------------------------------------------------------------------------------
 menu
------------------------------------------------------------------------------------ */
.menu-span {display:block; font-weight: 100; font-size: 14px;}
/*#global_menu > ul > li > a > span:hover {color: #ffffff;}*/
#global_menu > ul > li:hover {background-color: #999999; cursor: pointer;}
#global_menu > ul > li > a:hover {color: #ffffff;}

.menu-sns {position: absolute; width: 100px; top: 30px; right: 10px;}
@media only screen and (max-width:767px){.menu-sns {position: absolute; width: 100px; top: 20px; right: 10%;}}
@media only screen and (max-width:524px){.menu-sns {position: absolute; width: 100px; top: 20px; right: 20%;}}

/*
.menu-sns a img {opacity: 1; transition: 0.5s;}
.menu-sns a img:hover {opacity: 0.7;}
*/



.pc #global_menu ul li a {padding: 21px 20px;}
@media only screen and (max-width:1199px){.pc #global_menu ul li a {padding: 17px 10px;}}

@media only screen and (max-width:991px){
	.pc #global_menu ul li a {padding: 22px 10px;}
	.pc #global_menu > ul > li > a {font-size: 12px;}
	.menu-span {font-size: 10px;}
}

@media only screen and (max-width:767px){#global_menu ul li a {text-align: left; padding: inherit; padding-left: 20px;}}

@media only screen and (max-width:767px){#global_menu {
	width: 100%!important; right: 0; height: 100%; overflow-y: scroll; opacity: 0.96;
	box-shadow: -5px 0 20px 0 rgb(0 0 0 / 40%);
	background: #333;
	position: fixed!important;
	-webkit-overflow-scrolling: touch;
	}
}


/* ----------------------------------------------------------------------
 slider
---------------------------------------------------------------------- */
#header_slider_nav .slick-list .slick-track {width: 300px!important; margin: 0 auto!important;}

.midashi-obi {
	font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
    font-weight: bold;
	font-size: 46px;
	text-align: left;
	text-shadow: 1px 1px 0px #000000;
	color: #ffffff;
	line-height: 1.4;
}

.h_slider_text {position: absolute;	top: -600px; left: 0;}
.h_slider_map {position: absolute; right: 0; top: -650px; z-index: 8;}
.h_slider_map img {width: 280px;}

@media only screen and (max-width:1230px){
	.h_slider_text {top: -510px;}
	.h_slider_map {top: -570px;}
}
@media only screen and (max-width:1199px){
	.h_slider_text {top: -500px;}
	.midashi-obi {font-size: 40px; padding-left: 10px;}
}
@media only screen and (max-width:991px){
	.h_slider_text {top: -460px;}
	.midashi-obi {font-size: 36px; padding-left: 15px;}
	.h_slider_map {top: -520px; right: 15px;}
	.h_slider_map img {width: 200px;}
}
@media only screen and (max-width:767px){
	.h_slider_text {top: -490px; width: 100%;}
	.midashi-obi {font-size: 24px; text-align: center;}
}
@media only screen and (max-width:750px){.h_slider_text {top: -450px;}}
@media only screen and (max-width:420px){.midashi-obi {font-size: 20px;}}




/*
.desktop-free {display: block!important;}
.desktop991 {display: none!important;}
.smartphone767 {display: none!important;}
.smartphone524 {display: none!important;}

@media only screen and (max-width:991px){
	.desktop-free {display: none!important;}
	.desktop991 {display: block!important;}
}
@media only screen and (max-width:767px){
	.desktop-free {display: none!important;}
	.desktop991 {display: none!important;}
	.smartphone767 {display: block!important;}
}
@media only screen and (max-width:524px){
	.desktop-free {display: none!important;}
	.desktop991 {display: none!important;}
	.smartphone767 {display: none!important;}
	.smartphone524 {display: block!important;}
}
*/
.slide_bg1 {background:url('../images/top-slider01.jpg') no-repeat center center; background-size:cover;}
.slide_bg2 {background:url('../images/top-slider02.jpg') no-repeat center center; background-size:cover;}
.slide_bg3 {background:url('../images/top-slider03.jpg') no-repeat center center; background-size:cover;}
/*
@media only screen and (max-width:991px){
	.slide_bg1 {background:url('../images/top-slider01-1.jpg') no-repeat center center; background-size:cover;}
}
*/

/* ----------------------------------------------------------------------
 3つの探す
---------------------------------------------------------------------- */
.h_slider_sagasu {width: 100%; position: absolute; bottom: 2px; z-index: 8; padding:20px; background: rgba(0,0,0,0.7);}
@media only screen and (max-width:991px){.h_slider_sagasu {bottom: 24px;}}

.h_slider_sagasu .row-ar .col-4 img {width:75%;}
.sagasu-r {text-align: right;}
.sagasu-c {text-align: center;}
.sagasu-l {text-align: left;}
@media only screen and (max-width:767px){
	.h_slider_sagasu .row-ar .col-4 img {width:280px; padding: 5px 0px;}
	.sagasu-r {text-align: center;}
	.sagasu-l {text-align: center;}
}


#search-station form {margin-left: auto;}
#search-free form {margin: 0 auto;}
#search-conditions form {margin-right: auto;}
#search-conditions form select {
	border-style: none;
	font-size: 16px;
	top: 2px;
	left: 10px;
	position: absolute;
	width: 280px;
	height: 32px;
	color: #adadad;
	font-family: "Segoe UI", Verdana, "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}

.search-form {
	display: block;
    position: relative;
    height: 36px;
	background-color: #ffffff;
}
@media only screen and (max-width:767px){
	.search-form {background: none; opacity: 1;}
	form select {height: 36px!important; top: 0; left: 0px;}
}

.searchform_box {
	border-style: none;
	font-size: 14px;
	top: 2px;
	left: 10px;
	position: absolute;
	width: 75%;
	height: 32px;
}

.searchformbtn {
	position: absolute;
	width: 28px;
	top: 3px;
	right: 6px;
}

@media only screen and (max-width:991px){
	.searchform_box { height:24px; top:6px; left: 8px; font-size:14px; }
	.searchformbtn { width:22px; top:6px; }
}

@media only screen and (max-width:767px) {
	.search-form { height:36px; }
	.searchform_box { width: 90%; height: 32px; top:2px; left:10px; }
	.searchformbtn { width:28px; top:4px; right:10px; }
}


/* ----------------------------------------------------------------------
 search内 オススメ
---------------------------------------------------------------------- */
.osusume-box {display: block; max-width: 283px; overflow: hidden; position: relative;}
@media only screen and (max-width:767px) {.osusume-box {max-width: initial; margin-bottom: 5px; padding-left: 5px;}}
.col3search429 {display: block!important;}
.col3search428 {display: none!important;}
@media only screen and (max-width:429px){.col3search429 {display: none!important;} .col3search428 {display: block!important;}}
.osusume-box a {display: block; text-decoration: none; width: 100%; height: 100%; transition-property: background-color, color; transition-duration: 0.2s; transition-timing-function: ease;}
.osusume-box a:hover {display: block; width: 100%; height: 100%;}
.osusume-box a:hover .img-exp-intro .img-exp-intro-omote {opacity: 0;}
.osusume-text {
	position: absolute;
    bottom: 0;
    left: 0;
    z-index: 9;
    color: #fff;
    font-size: 28px;
	width: 100%;
/*	padding: 30px 30px 5px;*/
	padding-bottom: 25%;
	text-align: center;
    font-weight: 500;
    line-height: 1.6;
    overflow: hidden;
    font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
}
@media only screen and (max-width:991px){.osusume-text {font-size: 24px;}}
@media only screen and (max-width:429px){.osusume-text{padding-bottom: 10%; font-size: 18px;}}


/* ----------------------------------------------------------------------
 table 恵方・本厄・年号etc
---------------------------------------------------------------------- */
#cont-explanation .container { max-width:1150px; margin:0 auto; }

@media only screen and (max-width:1199px){ #cont-explanation .container { max-width:1000px; padding:0px 10px; }}
@media only screen and (max-width:991px){ #cont-explanation .container { max-width: 880px; padding:0px 10px; }}
@media only screen and (max-width:767px){ #cont-explanation .container { width: 100%; padding:0 5px;}}


.ss-fleft {float: left;}
.ss-fleft img {transition: 1.0s; transform: rotateY(0deg); padding-top: 5px; padding-right: 5px;}
.ss-fleft:hover img {
	transform: rotateY(360deg);
	filter: invert(8%) sepia(99%) saturate(7044%) hue-rotate(247deg) brightness(100%) contrast(145%);
}
.ss-eigo {font-size: 18px; font-weight: 500;}
.ss-wayaku {font-size: 16px; padding: 5px;}
.ss-sptext a:hover {text-decoration: none; color: #7fa9d6;}

@media only screen and (max-width:1199px){
	.ss-eigo {font-size: 16px;}
	.ss-wayaku {font-size: 14px;}
}

@media only screen and (max-width: 767px) {
	.ss-fleft {float: none; text-align: center;}
	.ss-sptext {text-align: center;}
	.ss-wayaku {font-size: 12px;}
}

/* ---------------------------------------------- */







/* ----------------------------------------------------------------------
 コンテンツ
---------------------------------------------------------------------- */

.container {max-width: 1150px; margin: 0 auto;}
@media only screen and (max-width:1199px){.container {max-width: 1000px;}}
@media only screen and (max-width:991px){.container {max-width: 880px; padding-left: 10px; padding-right: 10px;}}
@media only screen and (max-width:767px){.container {width: 100%;}}

.container-search {max-width: 1145px; margin: 0 auto;}
@media only screen and (max-width:1199px){.container-search {max-width: 995px;}}
@media only screen and (max-width:991px){.container-search {max-width: 875px; padding-left: 10px; padding-right: 10px;}}
@media only screen and (max-width:767px){.container-search {width: 100%;}}

.heading-title {
	font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	font-weight: 500;
	font-size: 36px;
	padding-botton: 8px;
	color: #333333;
}
.heading-title-w {
	font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	font-weight: 500;
	font-size: 36px;
	padding-bottom: 8px;
	color: #ffffff;
}
@media only screen and (max-width:767px){.heading-title, .heading-title-w {font-size: 24px;}}

.heading-main {font-size: 36px;}
@media only screen and (max-width:767px){.heading-main {font-size: 24px;}}

.heading-text {font-size: 16px; display: inline-block;}
@media only screen and (max-width:767px){.heading-text {font-size: 14px; display: block;}}

.heading-title::before {
	content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    border-bottom: 2px solid #cccccc;
    width: 96%;
    margin: 0 auto -15px;
}
.heading-title::after {
	content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    border-bottom: 2px solid #7e2b23;
    width: 20%;
    margin: 0 auto -15px;
}

.heading-title-w::before {
	content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    border-bottom: 2px solid #ffffff;
    width: 100%;
    margin: 0 auto -15px;
}
.heading-title-w::after {
	content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    border-bottom: 2px solid #b9d1ea;
    width: 20%;
    margin: 0 auto -15px;
}





/* ---------------------------------------------------------------------- */
/* 202109修正対応分 */

.heading-title-c {
	font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	font-weight: 500;
	font-size: 48px;
	margin-bottom: 8px;
	line-height: 1.6;
	color: #000000;
}
.heading-title-cw {
	font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	font-weight: 500;
	font-size: 48px;
	margin-bottom: 8px;
	line-height: 1.6;
	color: #ffffff;
}
.heading-text-c {
	position: relative;
	font-size: 16px;
	display: inline-block;
	font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
    color: #000000;
	line-height: 2.3;
}
/*
.heading-text-c::before {
	content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    border-bottom: 2px solid #cccccc;
    width: 100%;
    margin: 0 auto -15px;
}
*/
.heading-text-cw {
	position: relative;
	font-size: 16px;
	display: inline-block;
	font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
    color: #ffffff;
	line-height: 2.3;
}
/*
.heading-text-cw::before {
	content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    border-bottom: 2px solid #ffffff;
    width: 100%;
    margin: 0 auto -15px;
}
*/

.heading-title_sp {
	font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	font-size: 24px;
	color: #000;
	font-weight: 500;
	text-align: center;
	line-height: 1.2;
	}

		
@media only screen and (max-width:767px){
	.heading-title_sp {font-size: 24px;}
	.heading-title_sp span {font-size: 18px;}
	.heading-text-c {font-size: 14px; margin-top: 10px; line-height: 1.75;}
	.heading-text-cw {font-size: 14px; margin-top: 10px; line-height: 1.75;}
}

.sns-bgf3 {background-color: #f3f3f3;}
.sns-bgf3 a {display: list-item; -webkit-transition: all .3s; transition: all .3s;}
.sns-bgf3 a:hover.on_fb {display: list-item; background-color: #39538e!important; text-decoration: none;}
.sns-bgf3 a:hover.on_tw {display: list-item; background-color: #000!important; text-decoration: none;}
.sns-bgf3 a:hover.on_ig {display: list-item; background-color: #d35260!important; text-decoration: none;}
.sns_omote {opacity: 1; position: absolute; top: 0; left: 0; z-index: 6;}
.sns_ura {position: absolute; top: 0; left: 0; z-index: 4;}
.sns-bgf3 a:hover img.sns_omote {opacity: 0;}


/* ----------------------------------------------------------------------
 content-top
---------------------------------------------------------------------- */

#content-top {background: url("../images/special/special-bg2.webp") no-repeat center center;}
@media only screen and (max-width:1200px){
	#content-top {background: url("../images/special/special-bg2-1.webp") no-repeat center center;}
}
@media only screen and (max-width:767px){
	#content-top {background: url("../images/special/special-bg2-3.webp") no-repeat center center;}
}


/* ---------------------------------------------------------------------- */


.midasi-p {font-size: 16px; color: #000000;}
.index3h {padding: 50px 0 50px; max-width: 1150px; margin: 0 auto;}
@media only screen and (max-width:1230px){.index3h {padding: 37px 30px 40px;}}
@media only screen and (max-width:767px){.index3h {padding: 30px 10px 0px!important;}}

#index_3box {position: relative; overflow: hidden; z-index: 2;}
#index_3box::before {content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 50%; margin: 10% -10% 0; background-color: #fff; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: rotate(356deg); -ms-transform: rotate(356deg); transform: rotate(356deg); z-index: -1;}
@media only screen and (max-width:767px){
	#index_3box {margin-top: 30px;}
	#index_3box_header .desc {margin: 0 0 20px 0;}
}


#index_3box_header .midasi-h3 {font-size:40px; line-height: 1.6; margin-bottom: 8px; color: #000000; display: block;}

@media only screen and (max-width:991px){#index_3box_header .midasi-h3 {font-size:32px;}}
@media only screen and (max-width:815px){#index_3box_header .midasi-h3 {font-size:28px;}}
@media only screen and (max-width:675px){
	#index_3box_header .midasi-h3 {font-size:24px;}
	.midasi-p {font-size: 14px;}
}

.link-yajirusi {position: absolute;top: 20px;right: 10px;font-size: 16px; display: block;}

.h2-kaiten span {display: inline-block;}
.h2-kaiten:hover {cursor: pointer;}
.h2-kaiten:hover span {transition: .6s; -webkit-transform: rotateY(360deg); transform: rotateY(360deg);}
.h2-kaiten:hover span:nth-of-type(1) { -webkit-transition-delay: .02s; transition-delay: .02s;}
.h2-kaiten:hover span:nth-of-type(2) { -webkit-transition-delay: .04s; transition-delay: .04s;}
.h2-kaiten:hover span:nth-of-type(3) { -webkit-transition-delay: .06s; transition-delay: .06s;}
.h2-kaiten:hover span:nth-of-type(4) { -webkit-transition-delay: .08s; transition-delay: .08s;}
.h2-kaiten:hover span:nth-of-type(5) { -webkit-transition-delay: .10s; transition-delay: .10s;}
.h2-kaiten:hover span:nth-of-type(6) { -webkit-transition-delay: .12s; transition-delay: .12s;}
.h2-kaiten:hover span:nth-of-type(7) { -webkit-transition-delay: .14s; transition-delay: .14s;}
.h2-kaiten:hover span:nth-of-type(8) { -webkit-transition-delay: .16s; transition-delay: .16s;}
.h2-kaiten:hover span:nth-of-type(9) { -webkit-transition-delay: .18s; transition-delay: .18s;}
.h2-kaiten:hover span:nth-of-type(10) { -webkit-transition-delay: .20s; transition-delay: .20s;}

.see_more {display: block; padding-right: 10px; margin-top: 10px;}
.see_more a {text-decoration: none;}
.see_more a:hover {text-decoration: underline;}

/* ----------------------------------------------------------------------
 special
---------------------------------------------------------------------- */
#special {padding-top: 20px;}
.col-special-6 {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
@media only screen and (max-width:767px){
	.col-special-6 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
	.special_caption figcaption {opacity: 1!important; bottom: 94px!important;}
	.special_caption_base figcaption {opacity: 1!important; bottom: 72px!important;}
}
@media only screen and (max-width:429px){.special_caption_base figcaption {bottom: 39px!important;}}
/*特集1列版
@media only screen and (max-width:429px){
	#special {background: url("../images/special/special-bg0.jpg") no-repeat center center;}
	.special_caption {padding: 0 0 80px 0;}
	.special_caption_base {padding: 0 0 80px 0; margin: 0!important;}
	.special_caption img {max-width: 320px;}
	.special_caption_base img {max-width: 320px;}
	.special_caption_base.spe-right {text-align:right; margin: 0;}
	.special_caption_base.spe-right img {max-width: 320px; }
	.special_caption figcaption {width: 80%!important; bottom: 120px!important; right: 0; left: auto!important; height: auto!important;}
	.special_caption_base.spe-right figcaption {width: 80%!important; bottom: 120px!important; left: 0!important; height: auto!important; text-align: left;}
	.special_caption_base figcaption {width: 80%!important; bottom: 120px!important; right: 0; left: auto!important; height: auto!important;}
}*/

.special_caption {
	line-height: 0;
	position: relative;
	overflow: hidden;
	margin:5px 5px 0px 0px;
	color: #ffffff;
}
.special_caption img {width: 100%; height: auto; -webkit-transition: all 0.4s; transition: all 0.4s; opacity: 1;}
.special_caption h2 {line-height: 1.6; margin: 0;	padding: 0;	border-bottom: 1px solid #fff; font-weight: 500;}
.special_caption p {line-height: 1.6;	margin: 0; padding: 0; font-size: 14px; padding-top: 10px; overflow: hidden; transition-property: color; transition-duration: 0.2s; transition-timing-function: ease;}
.special_caption p span {display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;}
.special_caption:hover img { -webkit-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1);}
.special_caption:hover figcaption {-webkit-transition: -webkit-transform 0.3s, opacity 0.1s; transition: transform 0.3s, opacity 0.1s; -webkit-transform: translateY(0); transform: translateY(0); opacity: 1;}
.special_caption figcaption {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 0.5em;
	-webkit-transition: -webkit-transform 0.35s, opacity 0.1s 0.3s;
	        transition:         transform 0.35s, opacity 0.1s 0.3s;
	-webkit-transform: translateY(100%);
	        transform: translateY(100%);
	opacity: 0;
	color: #ffffff;
	background: rgba(0,0,0,0.7);
}

.special_caption figcaption .spe-area, .special_caption_base figcaption .spe-area {
	overflow: hidden;
    -webkit-transition-property: color;
    -webkit-transition-duration: 0.2s;
    -webkit-transition-timing-function: ease;
    transition-property: color;
    transition-duration: 0.2s;
    transition-timing-function: ease;
}
.special_caption figcaption .spe-area h2, .special_caption_base figcaption .spe-area h2 {
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
	overflow: hidden;
}
.special_caption figcaption p span {
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
	overflow: hidden;
}

@media only screen and (max-width:767px){
	.special_caption {padding-bottom: 94px;}
	.special_caption:hover img { -webkit-transform: scale(1.0, 1.0); transform: scale(1.0, 1.0);}
	.special_caption:hover figcaption {-webkit-transform: translateY(100%); transform: translateY(100%);}

}

.special_caption_base {
	line-height: 0;
	position: relative;
	overflow: hidden;
	margin:5px 5px 0px 0px;
	color: #ffffff;
}
.special_caption_base img {width: 100%; -webkit-transition: all 0.4s; transition: all 0.4s; opacity: 1;}
.special_caption_base h2 {line-height: 1.6; margin: 0; padding: 0; border-bottom: 1px solid #fff; font-weight: 500;}
.special_caption_base p {line-height: 1.6; margin: 0; padding: 0; font-size: 14px; padding-top: 10px; overflow: hidden; transition-property: color; transition-duration: 0.2s; transition-timing-function: ease;}
.special_caption_base p span {display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1;}
.special_caption_base:hover img { -webkit-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1);}
.special_caption_base:hover figcaption {-webkit-transition: -webkit-transform 0.3s, opacity 0.1s; transition: transform 0.3s, opacity 0.1s; -webkit-transform: translateY(0); transform: translateY(0); opacity: 1;}
.special_caption_base figcaption {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 0.5em;
	-webkit-transition: -webkit-transform 0.35s, opacity 0.1s 0.3s;
	        transition:         transform 0.35s, opacity 0.1s 0.3s;
	-webkit-transform: translateY(100%);
	        transform: translateY(100%);
	opacity: 0;
	color: #ffffff;
	background: rgba(0,0,0,0.7);
}
/* 特集2列版 */
@media only screen and (max-width:767px){
	.special_caption_base {padding-bottom: 72px;}
	.special_caption_base:hover img { -webkit-transform: scale(1.0, 1.0); transform: scale(1.0, 1.0);}
	.special_caption_base:hover figcaption {-webkit-transform: translateY(100%); transform: translateY(100%);}
}

@media only screen and (max-width:429px){
	.special_caption_base {padding-bottom: 39px;}
	.special_caption_base p {display: none;}
	.special_caption h2 {border: none;}
	.special_caption_base h2 {border: none;}
	.special_caption p {display: none;}
	.special_caption {padding-bottom: 38px!important;}
	.special_caption figcaption {bottom: 38px!important;}
}



.figspecial {position: relative; margin: 0px 0px 10px 5px;}

.figspe_text {
	position: relative;
	width: 100%;
	max-height: 120px;
	padding: 0.5em;
	color: #ffffff;
	background: rgba(0,0,0,0.7);
}
.figspe_text h2 {line-height: 1.6; margin: 0; padding: 0; border-bottom: 1px solid #fff; font-weight: 500;}
.figspe_text p {
	line-height: 1.6;
	margin: 0;
	padding: 0;
	font-size: 14px;
	padding-top: 10px;
	text-overflow: ellipsis;
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
@media only screen and (max-width:767px){
	.figspe_text {padding: 0;}
	.figspe_text h2 {font-size: 16px; line-height: 1.6; padding: 10px;}
	.figspe_text p {font-size: 14px; line-height: 1.6; padding: 10px;}
}
@media only screen and (max-width:429px){
	.figspecial {margin: 0px 0px 80px 0px;}
	.figspe_text {position: absolute;}
}

.spe-area d {
	position: relative;
    display: inline-block;
    padding: 0 5px 0 20px;
    color: #000000;
    vertical-align: middle;
    text-decoration: none;
    font-size: 14px;
	line-height: 1.6;
	height: 20px;
	float: right;
}
.spe-area d::before,.spe-area d::after{
    position: absolute;
    top: 0;
    bottom: 0;
    right: 5px;
    margin: auto;
    content: "";
    vertical-align: middle;
}
.yajirusi-right::before {
	box-sizing: border-box;
    width: 16px;
    height: 16px;
/*    border: 1px solid #fff;*/
	border: none;
    -webkit-border-radius: 0%;
    border-radius: 0%;
}
.yajirusi-right::after{
    left: 0px;
    width: 4px;
    height: 4px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* ----------------------------------------------------------------------
serch
---------------------------------------------------------------------- */
#sec-serch {background: url("../images/search/search-osusume-bg6.webp") no-repeat center center; padding: 90px 0px 50px;}
@media only screen and (max-width:767px){
	#sec-serch {background: url("../images/search/search-osusume-bg6_sp.webp") no-repeat center center; padding-bottom: 60px; padding-top: 60px;}
}

.col-serch-8 {-ms-flex: 0 0 66.666667%; flex: 0 0 66.666667%; max-width: 66.666667%;}
@media only screen and (max-width:991px){
	.col-serch-8 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
}
.col-serch-4 {-ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%;}
@media only screen and (max-width:991px){
	.col-serch-4 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
}


.serch-sec-bg {background-color: #f5f5f5; filter: drop-shadow(4px 4px 6px rgba(0,0,0,.5));}

.map-area {
	max-width: 1150px; text-align: center; margin-left: 20px; /*background: rgb(127,145,236);
	background: -moz-linear-gradient(180deg, rgba(127,145,236,0.36458333333333337) 0%, rgba(127,145,236,0.10407913165266103) 0%);
	background: -webkit-linear-gradient(180deg, rgba(127,145,236,0.36458333333333337) 0%, rgba(127,145,236,0.10407913165266103) 0%);
	background: linear-gradient(180deg, rgba(127,145,236,0.36458333333333337) 0%, rgba(127,145,236,0.10407913165266103) 0%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#7f91ec",endColorstr="#7f91ec",GradientType=1);*/
}
.map-area #pref_box img.nihontizu {max-width: 645px;}
@media only screen and (max-width:991px){.map-area #pref_box img.nihontizu {max-width: 508px;}}


.serch-area {max-width: 360px; margin: 0 auto;}
.serch-h3 {font-size: 36px; margin-bottom: 8px; line-height: 1.6; font-weight: 500; font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;}
@media only screen and (max-width:767px){.serch-h3 {font-size: 24px;}}


.col-3-search a .img-expansion img.hover-search-line {position: absolute; top: 0; left: 0;}
.col-3-search a:hover .img-expansion img.hover-search-img {transform: scale(1.2, 1.2);}
.col-3-search a:hover .img-expansion img.hover-search-line {transform: scale(1, 1);}

.col-4 a .img-expansion img.hover-search-line {position: absolute; top: 0; left: 0;}
.col-4 a:hover .img-expansion img.hover-search-img {transform: scale(1.2, 1.2);}
.col-4 a:hover .img-expansion img.hover-search-line {transform: scale(1, 1);}


.search-text {
	position: absolute;
    top: 0;
    left: 0;
    z-index: 9;
    width: 100%;
    text-align: center;
    overflow: hidden;
    -webkit-transition-property: color;
    -webkit-transition-duration: 0.2s;
    -webkit-transition-timing-function: ease;
    transition-roperty: color;
    transition-duration: 0.2s;
    transition-timing-function: ease;
}
.search-text span {
	font-size: 24px;
    color: #ffffff;
    padding: 10px 0px 10px;
    font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}
@media only screen and (max-width:1199px){.search-text span {font-size: 20px;}}
@media only screen and (max-width:991px){.search-text span {font-size: 16px;}}



.search3-sagasu {margin-bottom: 20px;}
@media only screen and (max-width:1199px){.search3-sagasu {margin-bottom: 20px;}}


#pref_box {position: relative; background-color: #fff; border: 2px solid #ddd; border-top: 1px solid #ddd; border-left: 1px solid #ddd;}

.col-4-ser {-ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%; margin-top: 10px; margin-bottom: 10px;}
@media only screen and (max-width:991px){
	.row-serch {max-width: 560px; margin: 0 auto;}
	.col-4-ser {padding: 0px 20px;}
}
@media only screen and (max-width:535px){
	.col-4-ser {padding: 0px 10px;}
}
@media only screen and (max-width:428px){
	.col-4-ser {padding: 0px;}
}

.ser-todoufuken_sp {position: absolute; top: 40px; left: 20px; width: 80px;}
@media only screen and (max-width:600px){.ser-todoufuken_sp {width: 40px;}}

.ser-todoufuken2_sp {position: absolute; top: 40px; left: 20px; width: 80px;}
@media only screen and (max-width:600px){.ser-todoufuken2_sp {width: 40px;}}


/* ----------------------------------------------------------------------
knowlege
---------------------------------------------------------------------- */
.know-box {height: 100px; margin: 20px 0px 0px 0px; background-color: #ffffff; overflow: hidden;}
.know-box4 {height: 340px; margin: 20px 0px 0px 0px; background-color: #ffffff; overflow: hidden; text-align: center;}
.know-box img {float: left; margin: 10px;}
.know-box a p {padding: 0px 10px;}
.know-box4 img {margin: 10px;}
.know-box4 a p {padding: 0px 10px;}
.know-box a p span.know-category-shrine img {position: absolute; right: 0px; bottom: 0px; margin: 0px 10px 0px 0px;}
.know-box a p span.know-category-temple img {position: absolute; right: 25px; bottom: 0px; margin: 0px 10px 0px 0px;}
.know-box4 a p span.know-category-shrine img {position: absolute; right: 0px; bottom: 5px; margin: 0px 10px 0px 0px;}
.know-box4 a p span.know-category-temple img {position: absolute; right: 25px; bottom: 5px; margin: 0px 10px 0px 0px;}
.know-box a:hover {text-decoration: none;}
.know-img {transition: 1.0s;}
.know-img:hover{opacity: 0.6;}

.knowlg {padding: 20px 10px;}

.know-box4 a img.icon-knowlg {width: 342px;}

@media only screen and (max-width:1199px){
	.know-box {height: 98px;}
	.know-box4 img {float: none;}
}
@media only screen and (max-width:767px){
	.know-box {height: 72px;}
	.know-box4 img {float: left;}
}
@media only screen and (max-width:474px){
	.know-box {height: 52px;}
}

@media only screen and (max-width:474px){
	.know-box4 {height: 142px;}
	.know-box4 a img {width: 136px!important;}
}

.bsdow {box-shadow: 0 1px 1px 0px rgba(0,0,0,0.25); -webkit-box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.25); position: relative;}
@media only screen and (max-width:767px){.bsdow{box-shadow: none; border-bottom: solid 1px #cccccc;}}
@media only screen and (max-width:474px){
	.bsdow a img {width: 48px;}
	.bsdow a p.dn474 {display: none;}
}


/* アニメーション */
.use_animation #knowlege .index_list_header .headline { opacity:0; }
.use_animation #knowlege .index_archive_link { opacity:0; }
.use_animation #knowlege.animated .index_list_header .headline {
  -webkit-animation: opacityAnimation 1.0s ease forwards 0.5s;
  animation: opacityAnimation 1.0s ease forwards 0.5s;
}
.use_animation #knowlege.animated .index_list_header .index_archive_link {
  -webkit-animation: opacityAnimation 1.0s ease forwards 1.0s;
  animation: opacityAnimation 1.0s ease forwards 1.0s;
}
.use_animation #knowlege .box { opacity:0; }
.use_animation #knowlege .box.active {
  -webkit-transform: translateY(50px); transform: translateY(50px);
  -webkit-animation: moveUp 0.65s ease forwards 1.5s;
  animation: moveUp 0.65s ease forwards 1.5s;
}

@media only screen and (max-width:767px){
#knowlege { margin: 0; }
#knowlege #work_list_wrap { padding:0; margin-bottom:0; }
#work_list_wrap { box-sizing:border-box; padding:0 20px; width:100%; }
.work_list { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
.work_list .box {
  width:100%; margin:0 0 20px 0;
}
.work_list .box .date { margin-bottom:0; }
.use_animation #knowlege .mobile_archive_link .index_archive_link { opacity:0; }
.use_animation #knowlege.animated .mobile_archive_link .index_archive_link {
  -webkit-animation: opacityAnimation 1.0s ease forwards 1.0s;
  animation: opacityAnimation 1.0s ease forwards 1.0s;
}
}

@media screen and (max-width:600px) {
  .work_list .box { float:none; width:100%; height:auto; margin:0 0 20px 0; padding-bottom:20px; }
  .work_list .box:nth-child(3n) { margin-right:0px; }
  .work_list .box:nth-child(2n) { margin-right:0px; }
  .work_list .box .title { height:auto; line-height:1.8; }
  .work_list .box .title a { padding:15px 20px; }
	.work_list .box .image { margin:75px auto 20px; }
	.work_list .box .catch { margin-left:20px; margin-right:20px; }
	.work_list .box .date { margin-left:20px; margin-right:20px; font-size:10px; }
}


#nikkei .know-box4 {text-align: left; margin: 20px 0px 0px 0px; background-color: #ffffff; overflow: hidden; height: 220px;}
#nikkei .know-box4 a p.fw-bold {font-size: 22px; padding-top: 10px; padding-left: 0;}
#nikkei .know-box4 a img.icon-knowlg {width: 100%; margin: 0; padding: 10px;}
#nikkei .know-box4 .col-8 .cate1 img {margin: 0; position: absolute; top: 44%;}
#nikkei .know-box4 .col-8 .cate2 img {margin: 0; position: absolute; top: 44%; left: 40%;}

.know-item {position: relative; display: block; padding: 0 6px 6px 0;}
.know-item a:hover {text-decoration: none!important; color: #999999;}

.know-category {display: block;}
.know-category a:first-child {display: inline-block;}
.know-category a {
	background-color: #000000;
	color: #ffffff;
	position: absolute;
	top: 1px;
	left: 1px;
	z-index: 3;
	min-width: 100px;
	height: 35px;
	line-height: 35px;
	text-align: center;
	font-size: 12px;
	padding: 0 15px;
	-webkit-box-sizing: border-box;
    box-sizing: border-box;
	text-decoration: none;
	transition-property: background-color, color;
    transition-duration: 0.2s;
    transition-timing-function: ease;
}
.know-category a:hover {background-color: #7e2b23;}


.title_area {
	border: 1px solid #ddd;
    border-top: none;
    background: #fff;
    display: block;
    height: 200px;
    padding: 18px 23px 23px;
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.title_area h4 {
	font-size: 16px;
    line-height: 1.6;
    color: #000;
    max-height: 4.8em;
    overflow: hidden;
    font-weight: bold;
    -webkit-transition-property: color;
    -webkit-transition-duration: 0.2s;
    -webkit-transition-timing-function: ease;
    transition-property: color;
    transition-duration: 0.2s;
    transition-timing-function: ease;
}
.title_area h4 span {display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;}
.title_area p.know_detail {
	position: absolute;
    top: 80px;
    left: 23px;
    font-size: 14px;
	color: #000000;
    padding-right: 23px;
    line-height: 1.6;
    overflow: hidden;
    -webkit-transition-property: color;
    -webkit-transition-duration: 0.2s;
    -webkit-transition-timing-function: ease;
    transition-property: color;
    transition-duration: 0.2s;
    transition-timing-function: ease;
}
.title_area p.know_detail span {display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3;}
.title_area .date {
	font-size: 12px;
    line-height: 1;
    color: #000;
    position: absolute;
    bottom: 23px;
    left: 23px;
}




/* ----------------------------------------------------------------------
focus
---------------------------------------------------------------------- */
#focus {background: url("../images/focus/focus-bg.webp") no-repeat center center; background-color: #121212; background-size: cover;}
@media only screen and (max-width: 767px) {
	#focus {background: url("../images/focus/focus_sp-bg.webp") no-repeat center center;}
}

.forcus-slider {display: flex; animation: loop-slide 20s infinite linear 1s both;}

@keyframes loop-slide {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
} 

.forcus-slider-bg {width: 2000px; display: flex; align-items: center; height: 280px; overflow: hidden;}
.forcus-cont {width: 280px; height: 280px; margin-right: 5px;}
.forcus-cont a img {width: 100%; height: auto; opacity: 0;}
.forcus-cont a:hover img {width: 100%; height: auto; opacity: 0.2;}
@media only screen and (max-width:1200px){
	.forcus-slider-bg {height: 242px;}
	.forcus-cont {width: 242px; height: 242px;}
}
@media only screen and (max-width:991px){
	.forcus-slider-bg {height: 207px;}
	.forcus-cont {width: 207px; height: 207px;}
}
@media only screen and (max-width:429px){
	.forcus-slider-bg {height: 160px;}
	.forcus-cont {width: 160px; height: 160px;}
}

.forcus-cont:nth-child(1) {background: url("../images/focus/focus01.webp") no-repeat; background-size: 100%;}
.forcus-cont:nth-child(2) {background: url("../images/focus/focus02.webp") no-repeat; background-size: 100%;}
.forcus-cont:nth-child(3) {background: url("../images/focus/focus03.webp") no-repeat; background-size: 100%;}
.forcus-cont:nth-child(4) {background: url("../images/focus/focus04.webp") no-repeat; background-size: 100%;}
.forcus-cont:nth-child(5) {background: url("../images/focus/focus05.webp") no-repeat; background-size: 100%;}



/* ----------------------------------------------------------------------
landmark
---------------------------------------------------------------------- */
#landmark {background: url("../images/landmark/landmark-bg.webp") no-repeat center center;}

#landmark .col-3 {margin-top: 5px;}

.landmark-box {
	background: rgba(255,255,255,0.8);
    position: absolute;
    margin: 10px;
    bottom: -100px;
    padding: 10px;
    box-shadow: 5px 5px 5px -5px rgb(0 0 0 / 50%);
    -webkit-box-shadow: 5px 5px 5px -5px rgb(0 0 0 / 50%);
}

.col-4 figure.land_caption {
	position: relative;
	overflow: hidden;
	width: 100%;
	min-width: 220px;
	max-width: 360px;
	max-height: 360px;
	margin: 20px auto;
	text-align: left;
	color: #fff;
	background: rgba(27, 37, 56, 1);
}
.col-3 figure.land_caption {
	position: relative;
	overflow: hidden;
	width: 100%;
	min-width: 120px;
	max-width: 240px;
	max-height: 240px;
	margin: 20px auto;
	text-align: left;
	color: #fff;
	background: rgba(27, 37, 56, 1);
}
figure.land_caption * {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}
figure.land_caption img {
	-webkit-transition: opacity 0.3s;
	        transition: opacity 0.3s;
	opacity: 1;
}
figure.land_caption figcaption {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 3em 3em;
}
figure.land_caption figcaption::before {
	position: absolute;
	top: 50%;
	right: 30px;
	bottom: 50%;
	left: 30px;
	content: '';
	-webkit-transition: all 0.4s;
	        transition: all 0.4s;
	-webkit-transition-delay: 0.2s;
	        transition-delay: 0.2s;
	opacity: 0;
	border-top: 1px solid rgba(255, 255, 255, 0.8);
	border-bottom: 1px solid rgba(255, 255, 255, 0.8);
	background-color: #fff;
}
figure.land_caption h2, figure.land_caption p {
	margin: 0 0 5px;
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	        transition: opacity 0.3s, transform 0.3s;
	opacity: 0;
}
figure.land_caption a {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	color: #fff;
}
figure.land_caption:hover img {opacity: 0.35;}
figure.land_caption:hover figcaption h2 {
	-webkit-transition-delay: 0.3s;
	        transition-delay: 0.3s;
	-webkit-transform: translate3d(0%, 0%, 0);
	        transform: translate3d(0%, 0%, 0);
	opacity: 1;
}
figure.land_caption:hover figcaption p {
	-webkit-transition-delay: 0.2s;
	        transition-delay: 0.2s;
	opacity: 0.9;
	line-height: 1.6em;
}
figure.land_caption:hover figcaption::before {
	top: 30px;
	bottom: 30px;
	-webkit-transition-delay: 0s;
	        transition-delay: 0s;
	opacity: 1;
	background: rgba(27, 37, 56, 0);
}

@media screen and (max-width:991px) {
	.col-3 figure figcaption p {display: none;}
	figure.land_caption figcaption {padding: 2em 2em;}
}
@media screen and (max-width:482px) {
	figure.land_caption figcaption {padding: 1em 1em;}
	figure.land_caption:hover figcaption::before {top:20px; bottom:20px;}
	figure.land_caption figcaption::before {right:20px; left:20px;}
}

/* ----------------------------------------------------------------------
dictionary
---------------------------------------------------------------------- */
#dictionary {background: url("../images/dictionary/pararax.webp") no-repeat fixed #ffffff; background-size: cover; height: auto;}
@media screen and (max-width:767px) {#dictionary {background: url("../images/dictionary/pararax_sp.webp") no-repeat #ffffff; background-size: cover; height: auto;}}

#dictionary ul {color: #333333; margin: 0 auto;}
#dictionary ul li {float: left; margin: 20px 10px 0px 10px;}
#dictionary ul li a {background-color: #ffffff; padding: 16px 24px; display: block; transition: 0.5s;}
#dictionary ul li a:hover {background-color: #7fa9d6; text-decoration: none; color: #ffffff;}

#dic-menu-change {display: none;}
#dic-menu ul li {
	display: inline-block;
	width: 80px;
	box-sizing: border-box;
	position: relative;
}
#dic-menu li ul {position: absolute; z-index: 999; width: 100%;}
#dic-menu li ul li {display: block; width: 100%;}
#dic-menu li ul li a {text-align: center;}
#dic-menu li ul li {overflow: hidden; height: 0; transition: .2s;}
#dic-menu li:hover ul li {overflow: visible; height: 52px; margin: 0;}

@media screen and (max-width:1025px) {
	#dictionary ul li {margin: 20px 5px 0px 5px;}
	#dic-menu ul li {width: 60px;}
}
@media only screen and (max-width:767px){
	#dic-menu {display: none;}
	#dic-menu-change {display: block;}
}

.col-dic-6 {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; display: inline-block;}
.col-dic-6 ul {display: flex; flex-wrap: wrap; align-items: stretch; justify-content: space-between; margin-top: -10px;}
.col-dic-6 ul li {width: 60px; margin-top: 10px;}
.col-dic-6 ul li a {
	display: block;
	width: 60px;
	height: 48px;
	color: #333333;
	font-size: 16px;
	background-color: #ffffff;
	box-shadow: 0px 5px 0 #000000;
	transition: .3s;
}
.col-dic-6 ul li a:hover {transform: translate3d(0, 5px, 0); box-shadow: none; color: #ffffff; background-color: #7fa9d6;}

@media only screen and (max-width:767px){
	#dictionary ul li a {width: 50px; height: 40px; padding: 10px; text-align: center;}
	#dictionary ul li {width: 16%!important; margin: 20px 5px 0px 5px;}
	#dictionary ul li a {width: 100%; height: auto;}
	.col-dic-6 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; display: block;}
	#dictionary {height: auto;}
}



/* ----------------------------------------------------------------------
news
---------------------------------------------------------------------- */
.cate-osirase a {display: block; background-color: #ea8113; border: solid 1px #ffffff; transition: 0.5s;}
.cate-osirase a:hover {background-color: #ffffff; border: solid 1px #ea8113; color: #333333!important;}
.cate-oyakudati a {display: block; background-color: #5db530; border: solid 1px #ffffff; transition: 0.5s;}
.cate-oyakudati a:hover {background-color: #ffffff; border: solid 1px #5db530; color: #333333!important;}
.cate-yougo a {display: block; background-color: #aa388f; border: solid 1px #ffffff; transition: 0.5s;}
.cate-yougo a:hover {background-color: #ffffff; border: solid 1px #aa388f; color: #333333!important;}
.cate-keisai a {display: block; background-color: #4883c5; border: solid 1px #ffffff; transition: 0.5s;}
.cate-keisai a:hover {background-color: #ffffff; border: solid 1px #4883c5; color: #333333!important;}
.cate-tokusyuu a {display: block; background-color: #d74543; border: solid 1px #ffffff; transition: 0.5s;}
.cate-tokusyuu a:hover {background-color: #ffffff; border: solid 1px #d74543; color: #333333!important;}

.news-syousai {content: ""; display: block; border-left: 1px solid #1F1F1F; border-top: 1px solid #1F1F1F; width: .625rem; height: .625rem; position: absolute; top: 18px; right: 3%; -webkit-transform: rotate(135deg); -ms-transform: rotate(135deg); transform: rotate(135deg);}


/* ニュース */
#news { width:calc(100% * 1150 / 1280); max-width:1150px; margin:0 auto; overflow: hidden; }
.news_notice li { margin:0 0 -1px 0; padding:0 25px; box-sizing:border-box; width:100%; overflow:hidden; }
.news_notice li:hover { background:#fafafa; }
.news_notice li:last-child { margin-bottom:0; }
.news_notice .date { float:left; line-height:42px; margin:0 22px 0 0; font-size:14px; font-family: "Segoe UI", Verdana, "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;}
.news_notice .category { float:left; margin:0 20px 0 0; line-height:42px; }
.news_notice .category a { display:inline-block; width: 90px; height:30px; line-height:30px; color:#fff; font-size:12px; min-width:70px; text-align:center; padding:0 20px; border-radius:30px; text-decoration:none; }

.news_notice .title { font-size:14px; font-weight:normal; width:96%; display: block; position: relative; white-space: nowrap;}
.news_notice .title a { display:block; line-height: 42px; overflow: hidden;}
.news_notice .title a:hover { text-decoration:none; }
/* アニメーション */
.use_animation #news .index_list_header .headline { opacity:0; }
.use_animation #news .index_archive_link { opacity:0; }
.use_animation #news.animated .index_list_header .headline {
  -webkit-animation: opacityAnimation 1.0s ease forwards 0.5s;
  animation: opacityAnimation 1.0s ease forwards 0.5s;
}
.use_animation #news.animated .index_list_header .index_archive_link {
  -webkit-animation: opacityAnimation 1.0s ease forwards 1.0s;
  animation: opacityAnimation 1.0s ease forwards 1.0s;
}
.use_animation #news li { opacity:0; }
.use_animation #news li.active {
  -webkit-transform: translateX(120px); transform: translateX(120px);
  -webkit-animation: moveLeft 0.65s ease forwards 1.5s;
  animation: moveLeft 0.65s ease forwards 1.5s;
}

@media only screen and (max-width:767px){
#news { width:auto; margin:0 auto; padding: 60px 0px 30px; }
#news .mobile_archive_link { margin-top:20px;}
.news_notice li { padding:0 18px; }
.news_notice .date { display:inline-block; float:none; margin:0px 10px 0 0; line-height:30px; }
.news_notice .category { display:inline-block; float:none; margin:0px 20px 0 0; line-height:30px; }
.news_notice .title { float:none; clear:both; display:inline-block; line-height:1.6; width:auto; }
.news_notice .title a { display:block; padding:0; white-space: nowrap; }
.use_animation #news .mobile_archive_link .index_archive_link { opacity:0; }
.use_animation #news.animated .mobile_archive_link .index_archive_link {
  -webkit-animation: opacityAnimation 1.0s ease forwards 1.0s;
  animation: opacityAnimation 1.0s ease forwards 1.0s;
}
}

.news-space {display: block; background-color: #f6f6f6; height: 130px; overflow: hidden; position: relative; border: 1px solid #ddd; border-top: none; border-left: none;}

.news-space a {display: block; text-decoration: none; width: 100%; height: 100%;}
.news-space a:hover {text-decoration: none;}

.news-space p {
	display: block;
    font-size: 12px;
    margin-top: -4px;
}

.news-pa {padding-right: 20px;}
.news-pama {padding-right: 20px; margin-top: 20px;}
.news-ma {margin-top: 20px;}
@media only screen and (max-width:767px){
	.news-pa {padding-right: 0px; margin-bottom: 20px;}
	.news-pama {padding-right: 0px;}
}


.img-exp-news {
	display: block;
    float: left;
    width: 100px;
    height: 100px;
    overflow: hidden;
    position: relative;
    margin: 15px;
}
.img-exp-news img {
	display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
	-webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.news-space a:hover .img-exp-news img {transform: scale(1.2, 1.2);}
.news-space a:hover .news-info h4 {color: #999999;}

.news-info {
	padding: 0 40px;
    line-height: 1.7;
    color: #000;
    position: absolute;
    top: 50%;
    left: 115px;
    right: 0;
    -webkit-transform: translate3d(0, -50%, 0);
    -moz-transform: translate3d(0, -50%, 0);
    -ms-transform: translate3d(0, -50%, 0);
    -o-transform: translate3d(0, -50%, 0);
    transform: translate3d(0, -50%, 0);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}
.news-info h4 {
	margin: 0;
    padding: 0;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.6;
    max-height: 4.8em;
    overflow: hidden;
    -webkit-transition: color 0.2s ease;
    transition: color 0.2s ease;
}


/* ----------------------------------------------------------------------
 movie
---------------------------------------------------------------------- */
#movie {background: url("../images/movie/movie-bg.webp") no-repeat center center; background-size: cover;}
.yt-osiete {width: 180px;}
@media only screen and (max-width: 767px) {
	#movie {background: url("../images/movie/movie-bg_sp.webp") no-repeat center center; background-size: cover;}
	.yt-osiete {width: 140px; margin: 0 auto;}
}


/* ----------------------------------------------------------------------
 introduction
---------------------------------------------------------------------- */
.col-int-5 {-ms-flex: 0 0 41.666667%; flex: 0 0 41.666667%; max-width: 41.666667%;}
.col-int-7 {-ms-flex: 0 0 58.333333%; flex: 0 0 58.333333%; max-width: 58.333333%;}
.col-12-int {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
@media only screen and (max-width: 767px) {
	.col-int-7 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
	.box-noutore {border-bottom: solid 2px #dddddd!important;}
	.col-12-int {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
}


#introduction { width:calc(100% * 1150 / 1280); max-width:1150px; margin:0 auto; overflow:hidden; }
#introduction_list {
	display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex;
	-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;
}
#introduction_list .box {
  width:50%; background:#f7f7f7; border:1px solid #ddd; margin:0 0 -1px 0; position:relative;
  -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box;
}
@media only screen and (max-width: 767px) {#introduction_list .box {width: 100%;}}

#introduction_list .box.num1, #introduction_list .box.num3 { border-right:none; }
#introduction_list .box.num3, #introduction_list .box.num4 { margin-bottom:0; }
#introduction_list .box .link {
  display:block; text-decoration:none; width:100%; height:100%; padding:10px;
  -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box;
}
#introduction_list .box a.link:hover { background:#eee; }
#introduction_list .box .image { width:180px; display:block; position:relative; float:left; margin:0 5px 0 0; }
#introduction_list .box .image img { display:block; width:100%; }
#introduction_list .box.num3 .image, #introduction_list .box.num4 .image { float:right; margin:0 0 0 35px; }
#introduction_list .box .catch { font-size:18px; line-height:1.6; margin:0 0 20px 0; }
#introduction_list .box .desc { font-size:14px; line-height:2.1; margin:0; overflow:hidden; }

/* アニメーション */
.use_animation #introduction_list .box { opacity:0; }
.use_animation #introduction_list .box.num1.active, .use_animation #introduction_list .box.num2.active {
  -webkit-transform: translateX(120px); transform: translateX(120px);
  -webkit-animation: moveRight 0.65s ease forwards 0.5s;
  animation: moveRight 0.65s ease forwards 0.5s;
}
.use_animation #introduction_list .box.num3.active, .use_animation #introduction_list .box.num4.active {
  -webkit-transform: translateX(-120px); transform: translateX(-120px);
  -webkit-animation: moveRight 0.65s ease forwards 1.0s;
  animation: moveRight 0.65s ease forwards 1.0s;
}


/* ４点ボックスコンテンツ */
@media only screen and (max-width:767px){
#introduction_list { flex-direction:column; }
#introduction {
  width: auto; margin:0 auto; padding: 60px 0px 0px;
  -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box;
}
#introduction_list .box { width:auto; margin:0 0 -1px 0; }
#introduction_list .box.num1, #introduction_list .box.num3 { border-right:1px solid #ddd; }
#introduction_list .box.num2, #introduction_list .box.num4 { border-right:1px solid #ddd; }
#introduction_list .box.num1 { margin-bottom:-1px; }
#introduction_list .box.num2 { margin-bottom:-1px; }
#introduction_list .box.num3 { margin-bottom:-1px; }
#introduction_list .box.num4 { margin-bottom:-1px; }
#introduction_list .box.num3 .image { float:left; margin:0 35px 0 0; }
#introduction_list .box.num2 .image, #introduction_list .box.num4 .image { float:right; margin:0 0 0 35px; }
}

@media screen and (max-width:550px) {
  #introduction_list .box { height:auto; float:none; }
  #introduction_list .box.num1, #introduction .box.num3 { border-right:1px solid #ddd; }
  #introduction_list .box.num2, #introduction_list .box.num4 { border-right:1px solid #ddd; }
#introduction_list .box.num1 { margin-bottom:-1px; }
#introduction_list .box.num2 { margin-bottom:-1px; }
#introduction_list .box.num3 { margin-bottom:-1px; }
#introduction_list .box.num4 { margin-bottom:-1px; }
  #introduction_list .box a.link { padding:10px; }
  #introduction_list .box .image { float:none; margin:0 auto 35px; }
  #introduction_list .box.num2 .image, #introduction_list .box.num3 .image, #introduction_list .box.num4 .image { float:none; margin:0 auto 35px; }
  #introduction_list .box .catch { text-align:center; }
  #introduction_list .box .desc { height:auto; overflow:none; }
}

.int-ver-rotation {width: 100%; height: auto; margin: 0 auto; overflow: hidden;}
.int-ver-rotation a img {width: 100%; cursor: pointer; transition-duration: 0.5s;}
.int-ver-rotation a:hover img {transform: rotateX( 360deg ); transition-duration: 0.5s;}

.int-hori-rotation {width: 100%; height: auto; margin: 0 auto; overflow: hidden;}
.int-hori-rotation a img {width: 100%; cursor: pointer; transition-duration: 0.5s;}
.int-hori-rotation a:hover img {transform: rotateY( 360deg ); transition-duration: 0.5s;}

.intro-box {display: block; max-width: 280px; overflow: hidden; position: relative;}
.intro-box a {display: block; text-decoration: none; width: 100%; height: 100%; transition-property: background-color, color; transition-duration: 0.2s; transition-timing-function: ease;}
.intro-box a:hover {display: block; width: 100%; height: 100%;}
a .img-exp-intro {display: block; width: 100%; height: 100%; overflow: hidden; position: relative;}
a .img-exp-intro img {width: 100%; height: auto;}
a .img-exp-intro .img-exp-intro-omote {opacity: 1; position: absolute; top: 0; left: 0; -webkit-transition: opacity 0.6s ease-out;-moz-transition: opacity 0.6s ease-out;-ms-transition: opacity 0.6s ease-out;transition: opacity 0.6s ease-out;}
.intro-box a:hover .img-exp-intro .img-exp-intro-omote {opacity: 0;}



.intro-text {
	position: absolute;
    bottom: 0;
    left: 0;
    z-index: 9;
    color: #fff;
    font-size: 14px;
    margin: 10px;
    line-height: 1.6;
    overflow: hidden;
    -webkit-transition-property: color;
    -webkit-transition-duration: 0.2s;
    -webkit-transition-timing-function: ease;
    transition-property: color;
    transition-duration: 0.2s;
    transition-timing-function: ease;
}
.intro-text span {display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;}
.intro-title {
	position: absolute;
    bottom: 40px;
    left: 40px;
    z-index: 9;
    color: #fff;
    font-size: 28px;
    font-weight: 500;
    margin: 10px;
    line-height: 1.6;
    overflow: hidden;
    font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
    -webkit-transition-property: color;
    -webkit-transition-duration: 0.2s;
    -webkit-transition-timing-function: ease;
    transition-property: color;
    transition-duration: 0.2s;
    transition-timing-function: ease;
}
.intro-title span {display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1;}
.intro-imgfront {position: absolute; top: 0; left: 0;}
.intro-imglogo {position: absolute; top: 10px; left: 10px; width: 48px; box-shadow: 2px 2px 6px 0 rgb(0 0 0 / 25%);}
.intro-imgcap {position: absolute; top: 10px; right: 10px; width: 70px; box-shadow: 2px 2px 6px 0 rgb(0 0 0 / 25%);}
.intro-logo {position: absolute; bottom: 56px; left: 5px; width: 22px;}

@media only screen and (max-width:429px){
	.intro-text{display: none;}
	.intro-title {bottom: 0;}
	.intro-logo {bottom: 16px;}
}



/* ----------------------------------------------------------------------
 footer
---------------------------------------------------------------------- */
.col-24 h6 {display: block; font-size: 14px;}
.col-24 p {display: block; font-size: 14px; line-height: 1.75em;}
.col-6-ft {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; padding-left: 30px; padding-top: 40px;}
.col-6-ftimg {padding-top: 30px;}
.ft-desktop {display: inherit; width: 100%;}
@media only screen and (max-width:767px){
	.col-6-ft {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
	#copyright {font-size: 12px; height: 24px; line-height: 24px;}
	#footer_top_inner {width: 100%; padding: 0px 10px 0px!important;}
	.col-6-ftimg {display: none;}
	.d-none {display: none!important;}
	.col-4-ft {-ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%; padding: 3px;}
	.col-4-ft h6 {font-size: 14px; line-height: 1.5;}
	.col-4-ft p {font-size: 14px; line-height: 1.5;}
	#return_top {display: none;}
	.ft-desktop {display: none;}
}

.footer-bg1 {background: url("../images/footer-bg01.jpg") no-repeat center center; background-size: cover;}
.footer-bg2 {background: url("../images/footer-bg02.jpg") no-repeat center center; background-size: cover;}

.footer-bg1 h6 a {color: #ffffff!important; font-size: 14px;}
.footer-bg1 p a {color: #ffffff!important; font-size: 14px;}

.footer-bg2 h6 {color: #ffffff!important; font-size: 14px;}
.footer-bg2 h6 a {color: #ffffff!important; font-size: 14px;}
.footer-bg2 p a {color: #ffffff!important; font-size: 14px;}


.footer_text {color: #FFF; margin-top: 70px; margin-bottom: 20px; font-size: 14px;}
.footer_text a {color: #fdcd00; text-decoration: none; font-size: 12px;}
.footer_text a:hover {color: #fde57d; text-decoration: underline;}
.footer_text02 {margin-top: 20px; line-height: 20px; font-size: 12px; color: #FFF;}
.footer_text02 p a {color: #ffffff;}
.footer_text04 {font-size: 14px;}
.footer_text04 a {display: inline-block; color: #121212;}
.footer_text04 a:hover {text-decoration: none; color: #999999;}

#footer_top .col-24 p {display: block; font-size: 12px; line-height: 20px;}

.ft-fontfamily {font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}

.footer_top2 {color: #ffffff; border-top: solid 1px #617396; padding-top: 20px; font-size: 14px; line-height: 20px;}
.ft-col2-sns {padding-top: 30px;}
.ft-col2-sns_sp {display: none;}
@media only screen and (max-width:1025px){
	#footer_top .container {padding: 0 10px;}
	.footer_top2 .container {padding: 0 10px;}
	.ft-col2-sns {display: none;}
	.ft-col2-sns_sp {display: block; position: absolute; bottom: 0; right: 4%;}
}

#footer_bottom_sp {display: none;}

@media only screen and (max-width:991px){
	#footer_top {display: none;}
	#footer_bottom {display: none;}
}

/* footer 特集 & 最新記事 */
.footer-space-area {padding-left: 10px; border-left: 1px solid #dddddd;}
.footer-space-area p a {font-size: 14px; color: #000000;}
.footer-space-area p a:hover {color: #999999; text-decoration: none;}

.footer-space {display: block; height: 100px; overflow: hidden; position: relative; margin-bottom: 10px; padding-left: 20px; padding-right: 5px;}

.footer-space a {display: block; text-decoration: none; width: 100%; height: 100%;}
.footer-space a:hover {text-decoration: none;}

.footer-space a .img-exp-news {
	display: block;
    float: left;
    width: 100px;
    height: 100px;
    overflow: hidden;
    position: relative;
    margin: 0px;
}
.footer-space a .img-exp-news img {
	display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
	-webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.footer-space a:hover .img-exp-news img {transform: scale(1.2, 1.2);}
.footer-space a:hover .footer-info h4 {color: #999999;}

.footer-info {
    position: relative;
    -webkit-transform: translate3d(0, -50%, 0);
    -moz-transform: translate3d(0, -50%, 0);
    -ms-transform: translate3d(0, -50%, 0);
    -o-transform: translate3d(0, -50%, 0);
    transform: translate3d(0, -50%, 0);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}
.footer-info h4 {
	position: absolute;
	top: 0;
    left: 110px;
	font-size: 14px;
    line-height: 1.6;
    color: #191919;
	font-weight: 500;
    overflow: hidden;
    -webkit-transition: color 0.2s ease;
    transition: color 0.2s ease;
    -webkit-transition-property: color;
    -webkit-transition-duration: 0.2s;
    -webkit-transition-timing-function: ease;
    transition-property: color;
    transition-duration: 0.2s;
    transition-timing-function: ease;
}
.footer-info h4 span {display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;}


@media only screen and (max-width:524px){
	.footer-space a .img-exp-news {width: 50px; height: 50px;}
	.footer-info h4 {left: 60px; font-size: 12px;}
	.footer-space {height: 50px;}
}


#footer_bb {height: 37px; background: url('../images/footer/footer-sita-r.jpg'); background-repeat: repeat-x;}
#footer_bb #copyright {color: #ffffff; font-size: 14px; line-height: 36px; font-family: 'Segoe UI', Verdana, '游ゴシック', YuGothic, 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif; max-width: 1150px; text-align: center; margin: 0 auto;}
@media only screen and (max-width:991px){
	#footer_bb {background: none; height: 70px;}
	#footer_bb #copyright {line-height: 70px; color: #000; border-top: 1px solid #ddd; font-size: 12px;}
}

.footer_sp-sns {position: static;
	width:100%;
	padding-top: 15px;
    padding-bottom: 12px;
    text-align: center;
	border-top: solid 1px #ddd;
}
ul.footer_sp-sns li {
	list-style-type: none;
	display: inline-block;
    margin-right: 10px;
}



/* footer sp */
#footer_sp {display: none;}
#footer_sp a {color: #121212;}
.footer_text_sp p a {color: #121212; font-size: 12px; line-height: 1.6;}

@media only screen and (max-width:991px){#footer_sp {display: block!important; height: auto; background: url(https://www.oshiete-oterasan.com/images/footer/footer-ue-r.jpg); background-repeat: repeat-x; padding: 0;}}


/* ----------------------------------------------------------------------
 bootstrap
---------------------------------------------------------------------- */
.row-ar {display: flex; flex-wrap: wrap;}
.col-12 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
.col-9 {-ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%;}
.col-8 {-ms-flex: 0 0 66.666667%; flex: 0 0 66.666667%; max-width: 66.666667%;}
.col-6 {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
.col-foot-6 {-ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%;}
.col-4 {-ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%;}
.col-3 {-ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
.col-24 {-ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%;}
.col-foot-2 {-ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%;}
.col-2 {-ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667%;}

@media only screen and (max-width:767px){
	.col-4 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
	.col-3 {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
}

@media only screen and (max-width:991px){
	.col-2 {-ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%;}
}


/* ----------------------------------------------------------------------
 全体
---------------------------------------------------------------------- */
/* 画像およびテキストフェードイン */
.fadein {
  opacity : 0;
  transform: translateY(20px);
  transition: all 1.2s;
}