﻿/*-------------------------------------------------
個別
---------------------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap');
@import url("https://use.typekit.net/onm7ghq.css");
body{font-family: 'Noto Sans JP',"游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif!important ;}
.menu_sub_title,.num {
    font-family: proxima-nova, sans-serif;

font-weight: 500;

font-style: normal;
}
body,h1,h2,h3,h4{font-weight: 600;}
.z_in-1{z-index: 1;}
#main_img{position: relative;}
#main_img::before{
    content: "";
    position: absolute;
    background-color: rgba(144,144,144,0.2);
    width: 100%;
    height: 100%;
    z-index: 1;
}
.header div.grid_3 a{color: #333;}
.catch {
    position: absolute;
    top: 24vw;
    left: 3vw;
    color: #fff;
    line-height: 1.5;
    transition: all 1.5s;
    z-index: 2;
}

.text01 {
    font-size: 40px;
    text-shadow: 0 0 5px rgb(0 0 0 / 20%);
}

.text02 {
    font-size: 24px;
    text-shadow: 0 0 5px rgb(0 0 0 / 20%);
}
#logo{margin-right: 20px;}
#logo a img{
    max-width: 600px;
    width: 90%;
}
#wrap{
    background-color: #fff;
    color: #333333;
}
#fakeloader{background-color: #fff;}
#main_menu.fixed {
    background-color: rgba(255,255,255,0.7)!important;
}
#main_menu ul li a,#f_menu ul li a{
    color: #333333;
}
.width_1000-max {
    max-width: 1500px!important;
}
#aisatsu > div{
    padding-left: 100px;
    padding-right: 100px;
    background-color: rgba(120,175,210,0.6)!important;
}
#top_contents{position: relative;}
#top_contents::before{
    content: "";
    position: absolute;
    width: 100%;
    height: 92%;
    top: 100px;
    left: 0;
    background-color: #F1F6FB;
}
#contents1 .contents_box.aos-init .fade_bg,
#contents2 .contents_box.aos-init .fade_bg,
#contents3 .contents_box.aos-init .fade_bg{
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    content: "";
    opacity: 1;
    -webkit-transition: opacity 1.0s 0.8s ease;
    transition: opacity 1.0s 0.8s ease;
    background-color: rgba(166, 210, 40, 1);
}
#contents2 .contents_box.aos-init .fade_bg{background-color: rgba(255,127,82,1);}
#contents3 .contents_box.aos-init .fade_bg{background-color: rgba(89,129,231,1);}
#contents1 .contents_box.aos-init.aos-animate .fade_bg,
#contents2 .contents_box.aos-init.aos-animate .fade_bg,
#contents3 .contents_box.aos-init.aos-animate .fade_bg{opacity: 0;}
#contents1 .contents_box, #contents2 .contents_box, #contents3 .contents_box{
    background-image: none!important;
    background-color: rgba(140,208,250,0.9);
    padding: 50px;
    border-radius: 0 20px 0 20px;
}
.contents_box2::before,.contents_box2::after{background-color: #8cd0fa;}
.cms_1-c a span {
    transform-origin: left;
    transform: scaleX(0);
    width: 100%;
    height: 100%;
}
.cms_1-c a:hover span {
    transform-origin: left;
    transform: scaleX(1);
}
.cms_1-c a:hover .date,.cms_1-c a:hover .box_title1 {
    color: #fff;
}
#top_cms .border_white{border: none;}

#top_cms .button-effect{text-align: center;}
#top_cms .effect.effect-1{
    background-color: #8cd0fa;
    padding: 15px 40px;
    border-radius: 50px;
    width: 130px;
}
#top_cms .cms_title h2::before, #top_cms .cms_title h2::after{background-color: #cedff1;}
#CMS_TITLE5{
    background-color: #f7f7f7;
    padding: 50px;
}
#top_link a{
    border-radius: 20px;
    background-color: #c0c0c0;
}
#top_link a:hover .link_bg {
    transform: translate(-50%, -50%) scale(1.05);
    opacity: 0.6;
}
.hover_bg{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50px;
    content: "";
    opacity: 0;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transform: scale(0.9, 0.9);
    transform: scale(0.9, 0.9);
}
#top_link a:hover .hover_bg{
    border-radius: 0;
    opacity: 1;
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
    background-color: rgba(166, 210, 40, 0.5);
    
}
#top_link .link_box:nth-of-type(2) a:hover .hover_bg{background-color: rgba(255,127,82,0.5);}
#top_link .link_box:nth-of-type(3) a:hover .hover_bg{background-color: rgba(89,129,231,0.5);}
.cate_wrap .link_box a{
    background-image: url(Dup/img/icon1.png);
    background-repeat: no-repeat;
    background-position: center top 20px;
    padding-top: 70px;
    padding-bottom: 20px;
    transition: all 0.3s;
}
.cate_wrap .link_box a:hover{transform: translateY(-5px);}
.cate_wrap .link_box:nth-of-type(2) a{ background-image: url(Dup/img/icon2.png);}
.cate_wrap .link_box:nth-of-type(3) a{ background-image: url(Dup/img/icon3.png);}
#top_cms{margin-bottom: 300px;}
.link_num:before{
    content: "01";
        font-size: 20px;
    display: block;
}
.cms_6-a .link_box:nth-of-type(2) .link_num:before{content: "02";}
.cms_6-a .link_box:nth-of-type(3) .link_num:before{content: "03";}
#info_map{
    position: relative;
    background-image: linear-gradient( 
180deg
 ,rgba(0,200,200,0),#8CD0FA);
    background-color: transparent;
}
#info_map >div.d_flex{align-items: stretch;}
/*#info_map::before{
        content: "";
    display: block;
    width: 100%;
    height: 200px;
    background-image: linear-gradient(180deg,rgba(0,200,200,0),#8CD0FA);
    position: absolute;
    top: -200px;
    left: 0;
}*/
footer{border-top: none!important;}
.linkStyle{color: #8CD0FA;}
/*-------------------------------------------------
下層
---------------------------------------------------*/
.cate_title {
    background-color: transparent;
    padding: 0;
    margin: 0;
    display: block;
    border: none;
    width: 100%!important;
    font-size: 24px;
    text-align: left;
    padding-bottom: 20px!important;
    margin-bottom: 50px;
    color: #8CD0FA;
    font-weight: normal;
    position: relative;
    border-bottom: solid 2px #ccc;
}
.cate_title::before {
    position: absolute;
    content: "";
    width: 50px;
    height: 2px;
    left: 0;
    bottom: -2px;
    background-color: #8CD0FA;
}
#contents{margin-bottom: 300px;}
#main_img2{max-width: 1500px;}
#main_img2 .page_title h2{background-color: transparent;}
#main_img2 .page_title span{
    color: #e7f6ff;
    opacity: 0.8;
    
}
#contact_tel a,#contact_tel2 a{color: #333!important;}
#page10 #contents ul li a{color: #8CD0FA!important;}
#page10 #contents ul li a span{color: #cedff1!important;}
.pager li a{color: #fff;}

/*-------------------------------------------------
tab
-----------------------------------------------------*/
@media screen and (max-width: 768px){
#logo img{width: 150px;}
#main_img{height: 67vw!important;}
#f_menu ul li a{letter-spacing: 1px;}
#top_cms {
    margin-bottom: 100px;
}
.catch{
    bottom: 8vw;
    top: inherit;
}
.text01 {
    font-size: 30px;
}
.text02 {
    font-size: 18px;
}
#aisatsu > div{
    padding-left: 20px;
    padding-right: 20px;
}
#logo{margin-right: 20%;}
#logo a img {
    width: 300px;
}
}



/*-------------------------------------------------
sp
-----------------------------------------------------*/
@media screen and (max-width: 667px){
#logo img {
    width: 80px;
}
#contents {
    margin-bottom: 150px;
}
#contents1 .contents_box, #contents2 .contents_box, #contents3 .contents_box {
    padding: 20px;
}
#CMS_TITLE5 {
    padding: 20px;
}
#info_map{background-image: linear-gradient( 180deg ,rgba(0,200,200,0),#8CD0FA 50%)}
.overlay{background: rgba(140,208,250,0.95);}
.overlay ul li a{color: #ffffff!important;}
.button_container.active .top,.button_container.active .bottom{background-color: #fff;}
.text01 {
    font-size: 18px;
    margin-bottom: 10px;
}
.text02 {
    font-size: 14px;
    width: 90%;
}
#aisatsu > div {
    padding-left: 20px;
    padding-right: 20px;
}
#CMS_TITLE5,#top_cms{margin-bottom: 50px;}
#contents1 .contents_box, #contents2 .contents_box, #contents3 .contents_box{border-radius: 0 0 0 20px;}
#logo{margin: 0 auto 20px;}
#logo img {
    width: 100%!important;
}
#logo{width: 50%!important;}
}


/*-------------------------------------------------
IE
-----------------------------------------------------*/
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none){
.cate_list li a{padding-top: 15px!important;}
#page9 .cate_box p a{padding: 8px 10px 8px!important;}
.pager li a, .pager .prev a, .pager .next a{padding-top: 0!important;}
}


/*-------------------------------------------------
Firefox
-----------------------------------------------------*/
@-moz-document url-prefix(){

}