﻿/*--------リンク・フォント--------*/
@font-face {
    font-family: 'NotoSans';
    font-style: normal;
    font-weight: 400;
    src: url('../Dup/img/NotoSans_r.woff') format('woff'),
        url('../Dup/img/Notosans_r.eot')  format('eot');
    font-display: swap;
}
@font-face {
    font-family: 'NotoSans';
    font-style: normal;
    font-weight: 700;
    src: url('../Dup/img/Notosans_bold.woff') format('woff'),
        url('../Dup/img/Notosans_bold.eot')  format('eot');
    font-display: swap;
}
@font-face {
    font-family: 'futura';
    font-style: normal;
    font-weight: 400;
    src: url('../Dup/img/futura_pt.woff') format('woff'),
        url('../Dup/img/futura_pt.eot')  format('eot');
    font-display: swap;
}

body, .font_sans-serif {
    font-family: "NotoSans","游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif!important;
}
.linkStyle{color: #333333; text-decoration: underline;}

/*--------radius--------*/
#main_img #video .video{border-radius: 30px;}
#aisatsu,#aisatsu > div{border-radius: 20px;}
#top_contents figure img,#top_contents .contents_box{border-radius: 20px;}




/*--------全体--------*/
#fakeloader:before{
    content: " ";
    position: fixed;
    display: inline-block;
    width: 100vw;
    height: 100%;
    background: url(./Dup/img/load_add.png) no-repeat;
    background-size: cover;
    left: 0px;
    top: 0px;
    z-index: -10;
    opacity:0.85;
  }
.add_shadow{box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;}
#wrap.bg_color1{background-color:#fff;}
#wrap.txt_white, header .txt_white {color: #2b2d2d;}
body, .txt_color_nomal{color: #2b2d2d!important;}
#f_menu ul li a {
    color: #333;
    font-size: 0.95em;
    letter-spacing: 1px;
}
#info_map .foot_tel_bt a{color:#333}
#info_map p.txt_white {color: #333;}
#info_map .foot_tel_bt a:first-of-type {display: none;}
.header .grid_3 a:first-of-type{display:none;}

header,footer{position: relative;}
#info_map{position: relative;}


#wrap{position:relative;}
.back {
    content: " ";
    position: fixed;
    display: inline-block;
    width: 60em;
    height: 60em;
    background: url(./Dup/img/back.png) no-repeat;
    background-size: cover;
    right: -74px;
    bottom: -91px;
    z-index: 0;
	opacity: 0.25;
}
#main_img{position:relative;}
#main_img::before{
    content: "";
    position: absolute;
    display: inline-block;
    background: url(./Dup/img/main_catch.png) no-repeat;
    background-size: contain;
    width: 100%;
    height: 100%;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 5;
}
main{position:relative;}

#main_menu ul li p:first-of-type {
     font-family: "futura",sans-serif;
     font-weight: 700;
}
#main_menu ul li { padding: 10px 15px;}
#main_menu ul li a {color: #0e0e0e;}
#main_menu ul li a:hover {color: #1d4b58;}
#main_menu ul li p:first-of-type{font-size: 1rem;}

#main_menu.fixed ul li p:first-of-type {color: #fff;}
#main_menu.fixed ul li p:last-of-type{color: #fff;opacity:0.7;}
#main_menu.fixed {
    padding-top: 0;
    padding-bottom: 0;
    background: rgba(9, 54, 113, .75)!important;
}

#aisatsu > div {
    background-color: rgba(81, 82, 82, .7)!important;
}
#aisatsu > div p {color: #fff;}
#top_contents .contents_box{
    background-color: #fff!important;
    background-image: none!important;
}
#top_contents .contents_box2{
    text-align: center;
}
#top_contents .contents_box2 h2,#top_contents .contents_box2 p{
    color:#333;
}
#top_contents .contents_box2 p{
    text-align: left;
}
.underline{
    position: relative;
    display: inline-block;
    z-index: 1;  
}
.underline:after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -4px;
  width: 0%;
  height: 4px;
  background: #fff;
  z-index: -1;
  transition: all 0.8s;
}
#top_contents .underline:after {
  background: #093671;
}
.underline.active:after,#top_contents .underline.active:after {
  width: 100%;
}
#top_contents .no_item{
    width: 5.5em;
    height: 5.5em;
    left: -15px;
    top: -34px;
}

#top_cms h2{
    font-family: "futura",sans-serif;
}
#top_cms .cms_title{
    position: relative;
    z-index: +1;
}
#top_cms .cms_title span::before{
 content: "";
  display: block;
  position: absolute;
  left: 50%;
  top:0;
  width: 60px;
  height: 60px;
  border: 1px solid #a2bccd;
  border-radius: 50%;
  box-sizing: border-box;
  pointer-events: none;
  z-index: -1;
  animation: pulsate 2s linear infinite;
}

@keyframes pulsate {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: scale(2);
    opacity: 0;
  }

  100% {
    transform: scale(1);
    opacity: 0;
  }
}

#top_cms .border_white{
    background: #eaeef1;
    border-radius: 20px;
    border: 0;
}
.effect.effect-1 {
    font-family: "futura",sans-serif;
    text-transform: uppercase;
    color: #093671;
}

.zoomIn{
    opacity: 0;
    transform: scale(0.6);
	transition: 0.5s;
}
.zoomIn.active{
    opacity: 1;
    transform: scale(1);
}

#page-top a.bg_color3 {
    background-color: #093671;
}



/*--------下層--------*/
#main_img2 .page_title {
    background-color: rgba(250, 253, 253, .5)!important;
}
#main_img2 {background-position: 50% 50%;}
.page_title h2 span{
    color: #d8eaec;
}

.cate_title{ position: relative;}
.cate_title::after {
  content: '';
  position: absolute;
  display: inline-block;
  bottom: -15px;
  width: 85px;
  height: 3px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: #093671;
  border-radius: 2px;
}

#page8 .tel_box{
    position: relative;
    overflow: hidden;
    padding: 15px 20px 15px 20px;
}
#page8 .tel_box > a:before{
    content:"";
    position: absolute;
    width:100vw;
    height:100vh;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    left:50%;
    top:50%;
}
@media screen and (max-width: 1200px){
    #page8 .tel_box p{
        display: block;
        padding-right: 0px;
        margin-right: 0px;
        border-right: none;
        
    }
}

@media screen and (max-width: 667px){  
#page8 .tel_box a{
    font-size: 5.3vw;
    letter-spacing: 2px;    
}
}

/*--------タブレット--------*/
@media screen and (max-width: 768px){
    #fakeloader:before {
    width: 119vw;
    height: 120%;
    left: -133px;
    top: -53px;
    }
#main_menu ul li {
    padding: 10px 5px;
}
.back {
    width: 50em;
    height: 50em;
}
#copyright, #copyright a {
    text-align: left;
    padding-left: 16px;
}
}

/*--------スマートフォン--------*/
@media screen and (max-width: 667px){
    #fakeloader:before {
    width: 150vw;
    height: 125%;
    left: -110px;
    top: -39px;
}

    #logo{margin-left: 30px;}
    #top_contents .no_item {
    width: 4em;
    height: 4em;
    left: 50%;
    transform: translateX(-50%);
    top: -49px;
}
.back {
    width: 25em;
    height: 25em;
    right: -50px;
    bottom: -30px;
}
.underline {
    font-size: 5.7vw;
    text-align: left;
}
.page_title h2 span {
    font-size: 4vw;
}
#cms_1-a .pager li {
    margin-right: 0px;
}
#copyright, #copyright a {
    padding-left: 5px;
    padding-bottom: 130px;
}
}


/*--------------------------------------------
IE
--------------------------------------------*/
@media all and (-ms-high-contrast:none){
body{overflow:hidden;}



}