﻿/*===========================================================*/
/* 個別 */
/*===========================================================*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500&family=Noto+Sans+JP:wght@500&display=swap');
body{
        font-family: 'Montserrat',"Noto Sans JP", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif!important;
        font-weight: 500;
}
.linkStyle{color: #333;border-bottom: 1px solid;}
h1 {
    position: absolute;
    top: 0;
    left: 0;
}
h1::after{display: none;}
.fv_wrap{
    width: 60%;
    max-width: 1100px;
    z-index: 99;
}
.fv_box{
    background-color: rgb(38 122 171 / 40%);
    padding: 50px;
}
.photo01{
    max-width: 330px;
    width: 28%;
    right: 0;
    bottom: 0;
}
#loader::after, .sm-slider::after, #main_img h2::before, #menu_wrap::after{    background: linear-gradient(to right, rgb(68 141 255) 0%,rgb(58, 211, 214) 100%)!important;}
#intro{overflow: hidden;}
#intro #intro_box #intro_txt h3,#contents div h4{font-size: 2vw;}
#intro #intro_box #intro_txt h3::after{display: none;}
#intro #intro_box #intro_txt{transform: translateY(-50%);top: 50%;}
#main_img{justify-content: center;}
#main_img h2{font-size: 4vw;line-height: 1.5;}
#main_img .more a{
    box-shadow: 4px 4px #9b4800;
    border-radius: 10px;
    transition: 0.5s;
}
#main_img .more a:hover{transform: translateY(-5px);}
#main_img::after {
    background: radial-gradient(ellipse at center, rgba(255,255,255,0) 0%,rgb(41 86 113 / 50%) 100%)!important;
    z-index: 2;
}
#main_nav{
    width: 100%;
    padding: 0;
    top: 0;
    transform: none!important;
    position: absolute!important;
    z-index: 3;
}
#main_nav ul{
    justify-content: center;
    padding: 50px;
}
#main_nav ul::before, #main_nav ul::after{
    display: none;
}
#main_nav ul li a:hover {
    transform: translateY(-5px);
}
#intro2 .intro_title{
    font-size: 2vw;
    color: #23a2d3;
    border-bottom: 2px solid;
}
#contents_links .box_wrap .box a {
    padding: 81px 50px 20px;
}
#contents div{margin: 0 auto;}
#contents div::after{    background-color: rgb(35 162 211 / 90%);opacity: 0.9;}
#menu_wrap::after{opacity: 1;}
#footer_box .tel,#tel_contact .tel{display: none;}

/**** modal ****/
.modal_box .modal_box_item{
    box-shadow: 5px 5px 0 rgba(0,0,0,0.1);
    border-color: #35aad7;
}
.modal_box{
	top: 0;
	left: 0;
	pointer-events: none;
	transform: scale(0.95);
	transition-property: opacity, transform;
	z-index: 100;
    -webkit-backdrop-filter: blur(5px);
}
.modal_box > div{
	overflow-y: auto
}
.modal_box.active{
	pointer-events: auto;
	opacity: 1;
	transform: none
}
.modal_box .close{
	top: 30px;
	right: 30px;
	cursor: pointer
}
.modal_bg.bg_color1 {
    background-color: #ffffff;
}



@media(max-width: 667px) {
    .modal_box .close {
    top: 0;
    right: 0;
}
.modal_box > div {
    padding-top: 73px;
}
}
/*===========================================================*/
/* コード集 */
/*===========================================================*/




/*===========================================================*/
/* 下層 */
/*===========================================================*/
#page_title::after {background: radial-gradient(ellipse at center, rgb(96 125 139 / 70%) 0%,rgb(0 0 0 / 10%) 100%);}




/*===========================================================*/
/* タブレット */
/*===========================================================*/
@media screen and (max-width: 768px){
    .fv_box {
    background-color: rgb(38 122 171 / 40%);
    padding: 5% 15%;
}
.fv_wrap{
    width: 100%;
    max-width: 1000px;
    z-index: 99;
}
.photo01{
    max-width: 330px;
    width: 30%;
}
#intro #intro_box #intro_txt{position: relative;transform: none;}
#intro #intro_box #intro_img {
    transform: translateY(50px);
}
#intro2{padding: 0;}
#intro2 .intro_title {
    font-size: 5vw;
}
#intro #intro_box #intro_txt h3, #contents div h4 {
    font-size: 4vw;
}
#intro.on #intro_box #intro_txt {
    margin-left: 10%;
}
#intro #intro_box #intro_txt {
    width: 90%;
}
#page_title {
    padding-top: 200px;
}


}



/*===========================================================*/
/* スマホ */
/*===========================================================*/
@media screen and (max-width: 667px){
footer #footer #footer_box{padding: 10px;}
.photo01 {
    max-width: 330px;
    width: 45%;
    right: -5%;
    bottom: 0;
    z-index: 7;
}
.fv_wrap {
    width: 80%;
    max-width: 1000px;
    z-index: 99;
}
.fv_box{padding: 0;background-color: transparent;}
#intro2 .intro_title {
    font-size: 22px;
}
#intro #intro_box #intro_txt h3, #contents div h4 {
    font-size: 22px;
}

#page_title {
    padding-top: 150px;
}
#main_img {
    padding-top: 80vh;
}
#main_img::after{    background-color: rgb(38 122 171 / 40%)!important;}
#top_cms .top_cms_box .more a:hover::after{opacity: 0;}
#top_cms .top_cms_box .more a:hover{color: #000;}
#contents_links .box_wrap .box a div span{width: 125px;}
#menu_wrap {
    padding-top: 40px;
}
}


/*===========================================================*/
/* IE */
/*===========================================================*/
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none){



}


/*===========================================================*/
/* Firefox */
/*===========================================================*/
@-moz-document url-prefix(){

}