@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+Antique&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500&display=swap');

@font-face {
    font-family: 'aoyagi';
    font-style: normal;
    font-weight: 400;
    src: url('./Dup/img/aoyagi.woff') format('woff');
    font-display: swap;
}

body{
    font-family: 'Zen Kaku Gothic Antique',"游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.l-menu,.pc_nav,.en_font,.TopTxt04, h1, h2, h3, h4, h5, h6,.pager a, .cate_list li a, .sns_title, .con_no, .tel, .copyright{
    font-family: 'Noto Sans JP',"游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.tegaki{font-family: 'aoyagi',"游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}

/* -----------------------------　ボディ　------------------------------------- */
body{
    overflow: hidden;
}


.pagetop {
    z-index: 1;
}

.pagetop i{
    color: var(--black);
}


/*--------------------------------
疑似要素にオブジェクト
--------------------------------*/
#main_img,#con1,#con2 > div,#con2 .topimg3,#con3,#con3 .box_wrap,#con4,
.cmstitle,.footer_contact,.pagetitle{position: relative;}
/*リピートなし*/
#main_img:before,#main_img:after,#main_img .catch,#con1:before,#con1:after,#con2 > div:before,#con2 .topimg3:before,#con3:before,#con3:after,#con3 .box_wrap:before,#con3 .box_wrap:after,#con4:before,
.cmstitle:before,.footer_contact:before,.footer_contact:after,.pagetitle:before,.pagetitle:after{
content: "";
display: block;
background-size: cover;
background-repeat: no-repeat;
position: absolute;
}

/* color -----------------------------------------------------------------------------*/

:root {
    --color1: #00bcd4;
    --color2: #a2e5ed;
    --color3: #0099ff;
    --color4: #047d8c;
    --color5: #86d1d8;
    --white: #ffffff;
    --black: #001f33;
    --gray: #ccc;
}

body,.txt_color_nomal,.hvr_txt_color_nomal:hover{color: var(--black);}
.txt_white,.hvr_txt_white:hover{color: var(--white);}
.txt_color1,.hvr_txt_color1:hover{color: var(--color1);} /* メインカラー */
.txt_color2,.hvr_txt_color2:hover{color: var(--color2);} /* サブカラー */
.txt_color3,.hvr_txt_color3:hover{color: var(--color3);} /* アクセントカラー1 */
.txt_color4,.hvr_txt_color4:hover{color: var(--color4);} /* アクセントカラー2 */
.txt_color5,.hvr_txt_color5:hover{color: var(--color5);} /* アクセントカラー2 */

/* background-color */
.bg_white,.hvr_bg_white:hover{background-color: var(--white)} /* 白背景 */
.bg_black,.hvr_bg_black:hover{background-color: var(--black);} /* 黒背景 */
.bg_color1,.hvr_bg_color1:hover{background-color: var(--color1);} /* メインカラー */
.bg_color2,.hvr_bg_color2:hover{background-color: var(--color2);} /* サブカラー */
.bg_color3,.hvr_bg_color3:hover{background-color: var(--color3);} /* アクセントカラー1 */
.bg_color4,.hvr_bg_color4:hover{background-color: var(--color4);} /* アクセントカラー2 */
.bg_color5,.hvr_bg_color5:hover{background-color: var(--color5);} /* アクセントカラー2 */
.bg_color_clear,.hvr_bg_color_clear:hover{background-color: transparent!important;}

/* border-color ※!important */
.border_white,.hvr_border_white:hover{border-color: var(--white);}
.hvr_border_black:hover{border-color: var(--black);}
.border_black{border-color: var(--gray);}
.border_color1,.hvr_border_color1:hover{border-color: var(--color1);}
.border_color2,.hvr_border_color2:hover{border-color: var(--color2);}
.border_color3,.hvr_border_color3:hover{border-color: var(--color3);}
.border_color4,.hvr_border_color4:hover{border-color: var(--color4);}
.border_color5,.hvr_border_color5:hover{border-color: var(--color5);}

/* ----------　linkStyle　---------- */
.linkStyle{
    color: var(--color1);
    border-bottom:solid 1px;
}

.linkStyle:hover{
	color: var(--color3);
	opacity: 0.7;
	transition: all 0.5s;
}

body#body {
    background: var(--white);
}

.txt_title{
	color: var(--color4);
}

/* color -----------------------------------------------------------------------------*/

/* ----------　custom_box　---------- */


/* ----------　custom　---------- */


/* ----------　cms　---------- */


/* ---------------------------------------------　TOP　---------------------------------------- */

#fakeloader .fl {
    position: absolute!important;
    top: 50%!important;
    left: 50%!important;
    transform: translate(-50%,-50%)!important;
    width: 50%!important;
    max-width: 300px;
}


#main_img .catch {
    background-image: url(./Dup/img/catch.png);
    transform: translate(0%,20%);
    background-size: 100%;
    width: 54vw;
    height: 35vw;
    bottom: 0%;
    z-index: 2;
}

h3.cate_title {
        text-align: center;
        font-size: 19px;
}

div#bnr {
    width: 80%;
    z-index: 1;
    transform: translate(22%,50%);
    bottom: 8%;
}

.topTxt1 .arrow{
    margin-left: 0;
    transform: translate(-50%, 0);
}

.topTxt1 {
    color: var(--black);
    border-radius: 67px;
    padding: 12px 25px 14px;
}

p.TopTxt04,.privacy h3 {
    color: var(--color1);
}

#con2 {
    padding-bottom: 150px;
}


/*#con3 {*/
/*    background-image: url(./Dup/img/bg_img1.png), url(./Dup/img/bg_img2.png);*/
/*    background-repeat: no-repeat;*/
/*    background-size: 111%;*/
/*    background-position: bottom, top;*/
/*    padding-top: 120px;*/
/*    padding-bottom: 140px;*/
/*}*/

#con3 .title{position: relative;}

#con3 {
    padding: 200px 0;
}

#con3:before {
    background-image: url(./Dup/img/bg_img2.png);
    background-size: cover;
    width: 100%;
    height: 121px;
    top: 0;
    left: 0;
}

#con3:after {
    background-image: url(./Dup/img/bg_img1.png);
    background-size: cover;
    width: 100%;
    height: 121px;
    bottom: 0px;
    left: 0;
    z-index: 1;
}


.TopTxt06 {
    color: var(--black);
}

.TopTxt02, .TopTxt03, .TopTxt06,.TopTxt08, .TopTxt10, .TopTxt12{
    color: var(--black);
}

/*#bnr{*/
/*    width: 500px;*/
/*}*/

/*.bnr_01,.bnr_02,.bnr_03 li{*/
/*    float: left;*/
/*    list-style: none;*/
/*    margin: 30px;*/
/*}*/

.fix_banner {
    width: 300px;
    position: fixed;
    bottom: 5px;
    right: 100px;
    z-index: 5;
}

.f_sitemap_inner {
    margin-top: 20px;
}

.footer a {
    font-size: 15px;
    font-weight: bold;
    color: var(--color4);
}

.footertxt {
    font-weight: bold;
    color: var(--color4);
}

.PageFooter {
    font-size: 13px;
}

.f_contact_btn a{
    color: var(--black);
}

/* ---------------------------------　下層ページ　--------------------------------- */
.pagetitle_img {
    background-size: cover;
    opacity: 0.75;
    mix-blend-mode: normal;
}

.pagetitle {
    text-shadow: var(--white) 1px 1px 0, var(--white) -1px -1px 0,/*右下、左上*/ var(--white) -1px 1px 0, var(--white) 1px -1px 0,/*右上、左下*/ var(--white) 0px 1px 0, var(--white) 0-1px 0,/*右、左*/ var(--white) -1px 0 0, var(--white) 1px 0 0;
    color: var(--black);
    font-weight: bold;
}

.f_contact_box h4{
    font-size: 30px;
}

.f_contact_box p{
    font-size:16px;
}


.cate_list:hover {
    opacity: 0.5;
}

.cate_list li a{transition: all 0.3s;}

.pagetxt{
    font-size: 20px;
}



/* -------------------　BLOG　----------------- */
ul.pager a {
    color: var(--white) !important;
}





/* ----------　会社情報　---------- */
#page7 .info .info__row .title{
    color: var(--color3);
}
/* ----------　お問い合わせ　---------- */
h3.width_30per.pd_5px.pd_l-20px.font_2dw_tb.txt_color2.width_100per_sp.pd_clear_sp{
    color: var(--color3);
}

#page8 .contact_mail a {
    color: var(--black);
    padding: 14px 97px;
    border-radius: 50px;
    transition: .3s;
}

#page8 .contact_tel a {
    color: var(--black);
    padding: 18px 40px;
    border-radius: 50px;
    transition: .3s;
}


#page8 .contact_mail a:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
    -webkit-animation: easeOutBounce .6s;
    animation: easeOutBounce .6s;
}

/* ----------　プライバシーポリシー ---------- */
#page9 .box .no {
    color: var(--black);
    background: var(--color1);
}

a.d_inline_b.pd_r-10px.pd_l-10px.bg_color1.border_rad5.txt_white.motion05s.mg_r-5px.mg_l-5px.hvr_bg_color4 {
    color: var(--black);
}

/* ----------　サイトマップ　---------- */
#page10 .sitemap li a{
    color: var(--black);
}


@media  screen and (max-width: 1536px){
#con2 .img_wrap:before {
    top: 14%;
    left: 61%;
}

}
/*1280px以下*/
@media  screen and (max-width: 1280px){

#con2 .img_wrap:before {
    left: 60%;
}

#con2:after {
    width: 20vw;
    bottom: -15%;
    left: 17%;
}

/*#con3:before {*/
/*    top: -1%;*/
/*    left: 0;*/
/*}*/

/*#con3:after {*/
/*    bottom: -11%;*/
/*    right: 5%;*/
/*}*/

}

/*1000px以下）*/
@media  screen and (max-width: 1000px){


.loopSlider_wrap{right: 40px;}

}

@media all and (-ms-high-contrast: none){
  .sample{

  }
}


/*-------------------------------------------------------タブレット-------------------------------------------------------*/
@media  screen and (max-width: 768px){
.logo1 {max-width: 150px;}



.menu_btn{border: none;box-shadow: none;}

.fix_banner{
width: 250px;
right: auto;
right: -6%;
-ms-transform: translate(-50%,0);
-webkit-transform: translate(-50%,0);
transform: translate(-50%,0);
}

.TopTxt09 {
    font-size: 19px;
}

#main_img:before{left: 3vw;}

#main_img .catch {
    transform: translate(0%,20%);
    bottom: 0%;
    background-size: 100%;
    width: 68vw;
    height: 40vw;
}

#con1 {
    padding-top: 50px;
    padding-bottom: 50px;
}

#con1:after{
width: 15vw;
height: 22vw;
bottom: -20vw;
left: 3vw;
}

#con2{padding-top: 150px;}

#con2 > div:before{
width: 11vw;
height: 17vw;
top: -180px;
right: -2vw;
}

#con2 .topimg3:before{
width: 8vw;
height: 12vw;
top: 80px;
left: -20vw;
}


#con3 {
    padding: 150px 0;
}

#con3:before {
    background-image: url(./Dup/img/bg_img2.png);
    background-size: cover;
    width: 100%;
    height: 58px;
    top: 0;
    left: 0;
}

#con3:after {
    background-image: url(./Dup/img/bg_img1.png);
    background-size: cover;
    width: 100%;
    height: 58px;
    bottom: 0px;
    left: 0;
    z-index: 1;
}




#con4{padding-top: 200px;}

.footer_contact:after{
width: 13vw;
height: 16vw;
top: -130px;
}

}
/*-------------------------------------------------------スマホ-------------------------------------------------------*/
@media  screen and (max-width: 667px){
.logo1 {max-width: 150px;}

.fix_banner {
    width: 200px;
    left: 50%;
}

.footertxt{max-width: 100%;}


#main_img:before{
width: 22vw;
height: 26vw;
bottom: -21vw;
left: 50%;
-ms-transform: translate(-50%,0);
-webkit-transform: translate(-50%,0);
transform: translate(-50%,0);
display: none;
}

#main_img .catch {
    transform: translate(0%,10%);
    bottom: 0%;
    background-size: 100%;
    width: 75vw;
    height: 40vw;
}

#con1 {
    padding-top: 30px;
    padding-bottom: 91px;
}

#con1:after{
width: 25vw;
height: 36vw;
bottom: -29vw;
left: 50%;
-ms-transform: translate(-50%,0);
-webkit-transform: translate(-50%,0);
transform: translate(-50%,0);
}

#con2{padding-top: 100px;}

#con2 > div:before{
width: 20vw;
height: 31vw;
top: -120px;
right: auto;
left: 50%;
-ms-transform: translate(-50%,0);
-webkit-transform: translate(-50%,0);
transform: translate(-50%,0);
}

#con2 .topimg3:before{
width: 14vw;
height: 20vw;
top: 0;
left: -20vw;
}

#con3 .title .en {
    font-size: 17px;
    font-weight: bold;
}

#con3 .box_wrap:before{
width: 18vw;
height: 33vw;
top: -210px;
left: 50%;
-ms-transform: translate(-50%,0);
-webkit-transform: translate(-50%,0);
transform: translate(-50%,0);
}

#con3 .box_wrap:after{
width: 17vw;
height: 26vw;
bottom: -110px;
right: -1vw;
display: none;
}

#con3 {
    padding: 70px 0 50px;
}
#con3:before {
    background-position: bottom;
}

#con3:after,#con3:before {
    height: 22px;
}



#con4{padding-top: 120px;}

#con4 .con_box{
width: 100%;
margin-right: 0;
margin-bottom: 30px;
}

.cmstitle:before{
width: 50px;
height: 50px;
top: -60px;
}

.footer_contact:after{
width: 20vw;
height: 25vw;
top: -85px;
}

.pagetitle{
padding-top: 150px;
padding-bottom: 80px;
}

.pagetitle:after{
width: 80px;
height: 145px;
top: 175px;
}

.topTxt1 {
    letter-spacing: 0;
    font-size: 12px;
    max-width: 100%;
}

.pagetop {
    right: 10px;
    bottom: 60px;
}

}/*--------------------------------video--------------------------------*/
/*--------------------------------TOP--------------------------------*/
#main_img,#video{height: 100vh;}
#video video{
height: auto;
position: absolute;
top: 50%;
left: 50%;
-ms-transform: translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
}
@media  screen and (max-width: 1600px){
#video video{
width: auto!important;
height: 100%;
}
}
/*タブレット用（768px以下）
--------------------------------------------------------------------------*/
@media  screen and (max-width: 768px){
#main_img,#video{ height: 50vh; }


#video video{
width: 100%!important;
height: auto;
}
}

/*スマホ用（667px以下）
--------------------------------------------------------------------------*/
@media  screen and (max-width: 667px){
.ip678 #main_img,.ip678 #video{ height: 45vh; }

.ipX #main_img,.ipX #video{ height: 45vh; }
}


/*2023/07/28*/
.tegaki {
    margin-top: -40px;
    text-align: right;
    font-size: 50px;
}

#page2,#page3,#page4,#page5,#page6,#page7,#page8,#page9,#page10{
    font-size: 18px!important;
}


@media  screen and (max-width: 667px){
.tegaki {
    font-size: 30px;
}

#page2,#page3,#page4,#page5,#page6,#page7,#page8,#page9,#page10{
    font-size: 14px!important;
}

}