﻿@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap');
body,.font_serif{font-family: 'Noto Sans JP',"游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;font-weight: 400;}
.font_bold{font-weight: 700;}


/*--------------------------------
疑似要素にオブジェクト
--------------------------------*/
#main_img,#intro,#intro2 h3,#contents1,#contents1 > div,#page_title,.line,.banner2,#contact_bar .mail,#page_title > div{position: relative;}
/*リピートなし*/
#main_img:before,#main_img:after,.catch,#intro:before,#intro:after,#intro2 h3:after,#contents1:before,#contents1:after,#contents1 > div:before,#page_title:before,#page_title:after,.line:before,.banner2:before,#contact_bar .mail:before,#page_title > div:before{
content: "";
display: block;
background-size: cover;
background-repeat: no-repeat;
position: absolute;
}

#main_img:before,#contents1:before,#page_title:before{
background-image: url(./Dup/img/wave1-2.png);
background-size: 1930px;
background-repeat: repeat-x;
width: 100%;
height: 100px;
bottom: -1px;
left: 0;
animation: loop 35s linear infinite reverse;
}
#main_img:after,#contents1:after,#page_title:after{
background-image: url(./Dup/img/wave1.png);
background-size: 1930px;
background-repeat: repeat-x;
width: 100%;
height: 100px;
bottom: -1px;
left: 0;
animation: loop 30s linear infinite;
}
#contents1:before,#contents1:after{
bottom: auto;
top: -180px;
}
@keyframes loop {
	0% {background-position-x: 0;}
	100% {background-position-x: -1930px;}
}

.catch{
background-image: url(./Dup/img/catch.png);
background-size: 100%;
width: 35vw;
height: 16vw;
top: 46%;
left: 50%;
-ms-transform: translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
}
#intro:before{
background-image: url(./Dup/img/obj1.png);
background-size: 100%;
width: 300px;
height: 260px;
top: -100px;
left: 5%;
}
#intro:after{
background-image: url(./Dup/img/obj2.png);
background-size: 100%;
background-color: transparent;
width: 300px;
height: 260px;
bottom: -65px;
left: auto;
right: 5%;
z-index: 1;
}
#intro2 h3:after,#contact_bar .mail:before,#page_title > div:before{
background-image: url(./Dup/img/icon1.png);
background-size: 100%;
width: 100px;
height: 150px;
top: -150px;
left: 50%;
-ms-transform: translate(-50%,0);
-webkit-transform: translate(-50%,0);
transform: translate(-50%,0);
}
#page_title > div:before{
background-image: url(./Dup/img/icon2.png);
width: 70px;
height: 70px;
top: 38px;
z-index: 1;
}

#contents1 > div:before{
background-image: url(./Dup/img/obj3.png);
background-size: 100%;
background-color: transparent;
width: 200px;
height: 175px;
bottom: -50px;
left: -78px;
transform: rotate(-10deg);
z-index: 1;
}

.line:before{
background-image: url(./Dup/img/line.png);
width: 86px;
height: 4px;
bottom: -10px;
left: 0;
}
.line1:before{
left: 50%;
-ms-transform: translate(-50%,0);
-webkit-transform: translate(-50%,0);
transform: translate(-50%,0);
}
#intro .line1:before{bottom: -20px;}

.banner2:before{
background-image: url(./Dup/img/icon2.png);
background-size: 100%;
width: 70px;
height: 70px;
top: -45px;
right: -15px;
transform: rotate(7deg);
pointer-events: none;
z-index: 1;
}

/*--------------------------------
全体
--------------------------------*/
body, .more a::after, .cate_list li a::after, #page10 ul li a .title::after, #tel_contact > div > .d_inline_b > div p span{background-color: #f9fafd;}
body,.font_14{font-size: 16px;}

.tel i{transform: none;}

.fix_banner,.fix_banner2{
position: fixed;
bottom: 10px;
right: 90px;
z-index: 5;
}
.fix_banner p{width: 300px;}
.fix_banner .banner1{margin-right: 20px;}
.fix_banner2{width: 300px;}
@media screen and (max-width: 768px){
    .fix_banner p{width: 250px;}
}
/* スマホ時真ん中へ */
@media  screen and (max-width: 667px){
    
.fix_banner{
bottom: 5px;
right: 50px;
}
.fix_banner p{width: 45%;}
.fix_banner .banner1{margin-right: 10px;}
.fix_banner2{
    width: 36%;
    bottom: 10px;
    right: 60px;
}

}
.fadein{
	transform: translateY(20px);
	transition: transform 1.5s ease, opacity 2s;
	transition-property: opacity,transform;
	opacity: 0;
}
.fadein.start{transform: translateY(0);opacity: 1;}
/*--------------------------------
TOP
--------------------------------*/
.index header{margin-bottom: 0;}
#main_img{height: 75vh;overflow: hidden;}
#main_img .slick{box-shadow: none;border-radius: 0;}

#intro{
background-image: url(./Dup/img/bg.jpg);
background-size: cover;
}

#intro2 > div{box-shadow: 0 0 15px rgba(0,0,0,0.1);}

/* TOPお知らせ */
.topcms_news_type2 .cate_box {
	width: 46.33333%!important;
	margin-right: 1.5%;
	margin-left: 1.5%;
	cursor: pointer;
	border-bottom: 1px solid #ddd;
	margin-bottom: 30px;
	box-shadow: 0 6px 12px rgb(0 0 0 / 0);
	/* padding: 20px; */
	/* border-radius: 20px; */
	/* background-color: #f5f5f5; */
}
.topcms_news_type2 .cate_box:hover {
	transform: translateY(-5px);
}
.topcms_news_type2 .cate_box .box_item {
	cursor: pointer;
}
.topcms_news_type2 .txt_height {
	height: 5em
}
.topcms_news_type2 .box_img1 {
	border-radius: 10px;
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
.topcms_news_type2 .cate_box {width: 100%!important;}
.topcms_news_type2 .txt_height {height: 3em}
}
/*--------------------------------
下層
--------------------------------*/
#page_title > div{
padding-top: 100px;
padding-bottom: 120px;
}

.page3 #cms_2-c .cate_photo figure{
    width: 48%;
    box-sizing: border-box;
}

.v_type3 .cate_box{border: 1px solid #4b5fa0;}
.v_type3 .box_title1{color: #0f2d91;}

@media  screen and (max-width: 1366px){

.catch{
width: 40vw;
height: 18vw;
}
#intro:before{
width: 18vw;
height: 16vw;
top: -80px;
}
#intro:after{
background-image: url(./Dup/img/obj2.png);
background-color: transparent;
width: 18vw;
height: 16vw;
bottom: -80px;
}
#contents1 > div:before{
width: 15vw;
height: 13vw;
bottom: -50px;
left: -3vw;
}

}

/*タブレット用（768px以下）*/
@media  screen and (max-width: 768px){

#main_img{height: 46vh;}
#main_img:before, #contents1:before, #page_title:before{
background-image: url(./Dup/img/wave2-2.png);
background-size: 1000px;
height: 70px;
bottom: -1px;
}
#main_img:after, #contents1:after, #page_title:after{
background-image: url(./Dup/img/wave2.png);
background-size: 1000px;
height: 70px;
bottom: -1px;
}
#contents1:before,#contents1:after{top: -170px;}

.catch{
width: 60vw;
height: 27vw;
}

#intro:before{
width: 23vw;
height: 20vw;
top: -85px;
}
#intro:after{
width: 23vw;
height: 20vw;
bottom: -40px;
}

#contents1 > div:before{
width: 18vw;
height: 16vw;
bottom: -25px;
left: -4vw;
}

}

/*スマホ用（667px以下）*/
@media  screen and (max-width: 667px){

.banner2:before{
width: 50px;
height: 50px;
top: -33px;
right: -10px;
}

#main_img{height: 38vh;}

.catch{
width: 80vw;
height: 36vw;
top: 43%;
}
#main_img:before, #contents1:before, #page_title:before{
background-image: url(./Dup/img/wave3-2.png);
background-size: 500px;
height: 50px;
bottom: -1px;
}
#main_img:after, #contents1:after, #page_title:after{
background-image: url(./Dup/img/wave3.png);
background-size: 500px;
height: 50px;
bottom: -1px;
}
#contents1:before,#contents1:after{top: -100px;}

#intro:before{
width: 32vw;
height: 28vw;
top: -60px;
}
#intro:after{
width: 32vw;
height: 28vw;
bottom: -30px;
}
#intro2 h3:after, #contact_bar .mail:before, #page_title > div:before{
width: 70px;
height: 100px;
top: -108px;
}
#page_title > div:before{
width: 70px;
height: 70px;
top: 38px;
}


#contents1 > div:before{
width: 26vw;
height: 23vw;
bottom: -28px;
left: -5vw;
}
#page_title > div{padding-bottom: 80px;}
.page3 #cms_2-c .cate_photo figure{width: 100%;}

}

/*IE*/
@media all and (-ms-high-contrast: none) {}




/*--------------------------------
自動リンク
--------------------------------*/
/* color */
.linkStyle{color: #0f2d91; text-decoration: underline;}
.txt_color_nomal .linkStyle{color: #0f2d91;}
.txt_white .linkStyle{color: white;}
.txt_red .linkStyle{color: red;}
.bg_color1 .linkStyle{color: #fff;}
.bg_color2 .linkStyle{color: #0f2d91;}
.bg_color3 .linkStyle{color: #fff;}
.bg_color4 .linkStyle{color: #eb91a5;}

/*IEのみ*/
@media all and (-ms-high-contrast: none) {
.linkStyle{display: inline-block;}
}

/*--------------------------------
カラー
--------------------------------*/
body,.txt_color_nomal,.hvr_txt_color_nomal:hover{color: #333333;}
.txt_black,.hvr_txt_black:hover{color: black;}
.txt_white,.hvr_txt_white:hover{color: white;}
.txt_red,.hvr_txt_red:hover{color: red;}
.txt_color1,.hvr_txt_color1:hover{color: #0f4b91;} /* メインカラー */
.txt_color2,.hvr_txt_color2:hover{color: #E1F0FA;} /* サブカラー */
.txt_color3,.hvr_txt_color3:hover{color: #eb91a5;} /* アクセントカラー1 */
.txt_color4,.hvr_txt_color4:hover{color: #FFE6F5;} /* アクセントカラー2 */

/* background-color */
.bg_white,.hvr_bg_white:hover{background-color: white;} /* 白背景 */
.bg_black,.hvr_bg_black:hover{background-color: black;} /* 黒背景 */
.bg_color1,.hvr_bg_color1:hover{background-color: #4b5fa0;} /* メインカラー */
.bg_color2,.hvr_bg_color2:hover{background-color: #E1F0FA;} /* サブカラー */
.bg_color3,.hvr_bg_color3:hover{background-color: #EBB4BE;} /* アクセントカラー1 */
.bg_color4,.hvr_bg_color4:hover{background-color: #FFE6F5;} /* アクセントカラー2 */
.bg_color_clear,.hvr_bg_color_clear:hover{background-color: transparent!important;}

/* border-color */
.border_white,.hvr_border_white:hover{border-color: white;}
.border_black,.hvr_border_black:hover{border-color: black;}
.border_color1,.hvr_border_color1:hover{border-color: #0f4b91;}
.border_color2,.hvr_border_color2:hover{border-color: #E1F0FA;}
.border_color3,.hvr_border_color3:hover{border-color: #EBB4BE;}
.border_color4,.hvr_border_color4:hover{border-color: #FFE6F5;}