﻿@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oswald&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&display=swap');
/* ---------------------------------------------------------------------------------------------　body　----------------------------------------------------------------------------------------------------------------- */

/*--------------------------------疑似要素にオブジェクト--------------------------------*/
#con1,#con2 > div,#con2 .topimg3,#con3,#con3 .box_wrap,.cmstitle,.footer_contact,.pagetitle,main.all_contents{position: relative;}

/*リピートなし*/
#con2 > div:before,#con2 .topimg3:before,#con3 .box_wrap:before,#con3 .box_wrap:after,
#con1:before,#con1:after,#con2:before,#con2:after,#con3:before,#con3:after,.cmstitle:before,.footer_contact:before,.footer_contact:after,.pagetitle:before,.pagetitle:after, .obj,main.all_contents::after{
content: "";
display: block;
background-size: cover;
background-repeat: no-repeat;
position: absolute;
}
/*--------------------------------疑似要素にオブジェクト--------------------------------*/



/* color -----------------------------------------------------------------------------*/
:root{
    --color1:#46b2ff;
    --color2: #bfdff9;
    --color3:#089ef6;
    --color4:#69acf1;
    --color5: #ffffff;
    --white:#eaf6fd;
    --black: #040024;
    --gray:#ccc;
    --font-jp: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Noto Sans JP", "Zen Kaku Gothic New", 游ゴシック体, "Yu Gothic", YuGothic, "游ゴシック Medium", "Hiragino Kaku Gothic ProN", メイリオ, meiryo, sans-serif !important;
    --font-en: "Jost", sans-serif !important;
}

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;
}

main.all_contents {
    padding: 50px 0;
    background-image: url(/Files/img/bg_img.png);
    background-color: var(--color2) !important;
    background-repeat: no-repeat;
    background-size: cover;
}

main.all_contents .privacy {
    background-color: var(--color5);
    border-radius: 10px;
}

.all_contents .content {
    padding: 2% 5%;
    background-color: var(--color5);
}

body#body {
    background: var(--white) !important;
}


/* font -----------------------------------------------------------------------------*/

body, .qa_type3 .cate_box .box_title1, .qa_type3 .cate_box .box_txt1{
    font-family: var(--font-jp);
    font-weight: 500;
}

.font1,#page_title h2 span,#top_cms h2 span{
    font-family: var(--font-en);
}

.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, #con3 .box_title, .cate_list li a, .cate_title{
    font-family: var(--font-en);
    letter-spacing: 3px;
    font-weight: 800;
}

/* font -----------------------------------------------------------------------------*/

/* font size-----------------------------------------------------------------------------*/

.shadow {
    border-radius: 10px;
    box-shadow: none;
}

h1, h2, h3, h4, h5, h6 {
    font-size: 110%;
}

.font_14,.font_15{
    font-size: 16px;
}

.font_2dw {
    font-size: -webkit-calc(1rem + 0px);
    font-size: calc(1rem + 0px);
}

#page2,#page3,#page4,#page5,#page6,#page7,#page8,#page9,#page10{
    font-size: 18px!important;
}

/* font size-----------------------------------------------------------------------------*/


.txt_title{
	color: var(--color4);
}

#sp_nav {
    background-image: url(/Files/img/rice-paper.png);
    /* background-repeat: no-repeat; */
    background-size: auto;
    background-position: left;
    background-color: var(--color4);
}

#sp_nav .sp_nav_inner .l-menu li a {
    color: var(--color3);
    font-weight: 900;
}

#sp_nav .sp_nav_inner .l-menu ul li a span{
    color: var(--color4);
}

#fakeloader {
    z-index: 9999;
    background-color: var(--color4);
    background-image: url(/Files/img/rice-paper.png);
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: 50% 100%;
}

.menu_btn {
    border-radius: 50px;
    background-color: var(--color3) ! IMPORTANT;
    border: 1px solid var(--color3);
    color: var(--color5);
    background-image: url(/Files/img/rice-paper.png);
}

.menu_sns .box a {
    border-color: var(--color3);
    background-color: var(--color5);
}

/* more.link ▼-----------------------------------------------------------------------------*/
.more.link a {
    background-color: var(--color4);
    border: solid 3px var(--color4);
    color: var(--white);
    border-radius: 50px;
    background-image: url(/Files/img/rice-paper.png);
    background-size: auto;
}

.more.link a:hover {
    transition: 0.3s;
    background-color: var(--color1);
    border: solid 3px var(--color1);
    color: var(--color5);
}

.c-btn {
    transition: 0.3s;
    border-radius: 10px;
}

.c-btn i {
    color: var(--color5);
}

.c-btn i:hover {
    color: var(--black);
}
/* more.link ▲-----------------------------------------------------------------------------*/

/* cate_list ▼-----------------------------------------------------------------------------*/
.cate_list li:hover {
    /*opacity: 0.5;*/
    transition: all 0.3s;
    /*transition: transform 0.3s ease-in-out;*/
}

.cate_list li a {
    background-color: var(--color3);
    color: var(--color5);
    font-size: 16px;
    transition: all 0.3s;
    border: none;
    letter-spacing: 0;
}

.cate_list li a:hover{
    background-color: var(--color1);
    color: var(--black);
    transition: 0.3s;
}
/* cate_list ▲-----------------------------------------------------------------------------*/


body {
    overflow: hidden;
    background-color: var(--white);
}



.pagetop {
    z-index: 1;
    background-color: var(--black) ! IMPORTANT;
}

/* ----------------------------------------------------------------------------------------------　top　----------------------------------------------------------------------------------------------------------------- */

/* ---------------------------------------------　header ▼　---------------------------------------- */
.header-in {
    position: relative;
    width: 100%;
    box-sizing: border-box;
    height: 120px;
    border-radius: 100px;
    padding: 0px;
    -webkit-box-shadow: 0 2px 20px rgb(0 0 0 / 0%);
    box-shadow: 0 2px 20px rgb(0 0 0 / 0%);
    margin-top: 0;
    max-width: -webkit-fill-available;
    background-color: var(--color5);
    background-image: url(/Files/img/bg_img.png);
    border-radius: 0;
}

.header .logo1 {max-width: 200px;}


.header .logo1 a {
    color: var(--black);
}

.pc_nav {
    padding: 0 20px 0 20px;
    box-sizing: border-box;
    max-width: 1000px;
    justify-content: space-between;
}

.pc_nav li {
    padding-top: 0;
    padding-right: 0;
    padding-left: 14px;
}

.pc_nav li a {
    background-image: url(/Files/img/header_icon1.png);
    background-size: 43px auto;
    padding: 45px 5px 0;
    display: block;
    background-repeat: no-repeat;
    background-position: 50% 0;
}

.pc_nav li:nth-child(2) a {
    background-image: url(/Files/img/header_icon2.png);
}

.pc_nav li:nth-child(3) a {
    background-image: url(/Files/img/header_icon3.png);
}

.pc_nav li:nth-child(4) a {
    background-image: url(/Files/img/header_icon4.png);
}

.pc_nav li:nth-child(5) a {
    background-image: url(/Files/img/header_icon5.png);
}

.pc_nav li a .en {
    display: none;
    color: var(--black);
    font-size: 12px;
}


/* ---------------------------------------------　header ▲　---------------------------------------- */

/* ---------------------------------------------　fakeloader  ▼　---------------------------------------- */
#fakeloader .fl {
    position: absolute!important;
    top: 50%!important;
    left: 50%!important;
    transform: translate(-50%,-50%)!important;
    width: 50%!important;
    max-width: 300px;
}
/* ---------------------------------------------　fakeloader  ▲　---------------------------------------- */

/* ---------------------------------------------　つなぎデザイン　▼------------------------------------------------- */
#con2:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url(/Files/img/bg_img1.png);
    background-repeat: repeat-x;
    background-position: top left;
    background-size: 1000px;
    pointer-events: none;
}

#con3:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url(/Files/img/bg_img2.png);
    background-repeat: repeat-x;
    background-position: top left;
    background-size: 1000px;
    pointer-events: none;
}

#con3:after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url(/Files/img/bg_img3.png);
    background-repeat: repeat-x;
    background-position: bottom left;
    background-size: 1000px;
    pointer-events: none;
}

.footer_contact:before{
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url(/Files/img/bg_img5.png);
    background-repeat: repeat-x;
    background-position: top left;
    background-size: 1000px;
    pointer-events: none;
}

main.all_contents::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url(/Files/img/bg_img7.png);
    background-repeat: repeat-x;
    background-position: top left;
    background-size: 1000px;
    pointer-events: none;
}


#page2 .footer_contact:before,#page3 .footer_contact:before,#page4 .footer_contact:before,#page5 .footer_contact:before,#page6 .footer_contact:before,#page7 .footer_contact:before,#page8 .footer_contact:before,#page9 .footer_contact:before,#page10 .footer_contact:before{
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url(/Files/img/bg_img7.png);
    background-repeat: repeat-x;
    background-position: top left;
    background-size: 1000px;
    pointer-events: none;
}
/* ---------------------------------------------　つなぎデザイン　▲------------------------------------------------- */


/* ---------------------------------------------　#main_img　▼--------------------------------------------- */
#main_img {
    /* padding-top: 0; */
}

#main_img .catch {
    top: 43%;
    right: 56%;
    width: 42vw;
    height: 29%;
    bottom: 0;
    z-index: 2;
}

/*---------------------------------------------　#main_img　▲---------------------------------------------- */

/* ---------------------------------------------　TopTxt　▼------------------------------------------------- */

.TopTxt01 {
    background-color: transparent;
    color: var(--color3);
    border-bottom: solid 2px;
    border-radius: 0;
}

.TopTxt01 .arrow {
    color: var(--color3);
}

.topTxt1 .arrow{
    margin-left: 0;
    transform: translateX(-50%);
    bottom: -16px;
}

.TopTxt02 {
    color: var(--color3);
    background-image: url(/Files/img/aicon.png);
    background-repeat: no-repeat;
    background-position: 50% 10%;
    background-size: 80px;
    font-size: 40px;
    font-weight: 800;
    padding: 100px 0px 20px;
}

.TopTxt03 {
    line-height: 1.8;
    width: 888px;
    font-size: 18px !important;
    letter-spacing: -0.8px;
    text-align: left;
    margin: 0 auto;
}

.TopTxt04 {
    text-align: center;
    line-height: 1.5;
    font-size: 40px;
    margin-bottom: 10px;
    color: var(--color3);
    /* text-shadow: var(--white) 2px 2px 0, var(--white) -2px -2px 0, var(--white) -2px 2px 0, var(--white) 2px -2px 0, var(--white) 0px 2px 0, var(--white) 0 -2px 0, var(--white) -2px 0 0, var(--white) 2px 0 0; */
}

.TopTxt06 {
    color: var(--color3);
}

.TopTxt08, .TopTxt10, .TopTxt12 {
    font-weight: 500;
}

.TopTxt03,.TopTxt08, .TopTxt10, .TopTxt12{
    color: var(--black);
}

/* ---------------------------------------------　TopTxt　▲------------------------------------------------- */


/*---------------------------------------------　#con1　▼-------------------------------------------------- */
#con1 {
    background-color: var(--color2);
}

#con1 .title {
    position: relative;
    background-image: url(/Files/img/con1_title_bg_img.png);
    background-repeat: no-repeat;
    background-position: 100% 90%;
    background-size: 350px;
    padding: 0px 0px 30px;
    margin-bottom: 30px;
}

.con1_squ {
    background-image: url(/Files/img/bg_img6.png);
    height: 100px;
    z-index: 1;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    bottom: -50px;
}



/* ---------------------------------------------　#con1　▲------------------------------------------------- */

/* ---------------------------------------------　#con2　▼------------------------------------------------- */
#con2 {
    background-image: url(/Files/img/bg_img.png);
    background-color: var(--color5);
    background-repeat: no-repeat;
    background-size: cover;
}

#con2 .title {
    position: relative;
    background-image: url(/Files/img/con2_title_bg_img.png);
    background-repeat: no-repeat;
    background-position: 95% 80%;
    background-size: 300px;
    padding: 20px 0px 60px;
    line-height: normal;
}

/* ---------------------------------------------　#con2　▲------------------------------------------------- */

/* -----------------------------------------　#con3　▼----------------------------------------------------- */
#con3 {
    padding: 50px 0;
    background-color: var(--color2);
}

#con3 .title {
    background-image: url(/Files/img/aicon.png);
    background-repeat: no-repeat;
    background-position: 50% 10%;
    background-size: 80px;
    position: relative;
    padding: 100px 0px 20px;
}

#con3 .title .en {
    font-size: 40px;
    font-weight: 800;
    color: var(--color3);
}

#con3 .title .sl {
    display: none;
}

#con3 .box_title1 {
    display: inline-block;
    position: relative;
    background-image: url(/Files/img/con3_boxtitle_bg_img.png);
    background-repeat: no-repeat;
    background-position: 6% 10%;
    background-size: 90px;
    padding: 20px 0px 0px;
}

#con3 .box_title2 {
    display: inline-block;
    position: relative;
    background-image: url(/Files/img/con3_boxtitle_bg_img.png);
    background-repeat: no-repeat;
    background-position: 25% 10%;
    background-size: 90px;
    padding: 20px 0px 20px;
}

#con3 .box_title3 {
    display: inline-block;
    position: relative;
    background-image: url(/Files/img/con3_boxtitle_bg_img.png);
    background-repeat: no-repeat;
    background-position: 5% 10%;
    background-size: 90px;
    padding: 20px 0px 20px;
}

#con3 .box .img{
    border-radius: 10px;
}



.box_title {
    color: var(--color3);
    font-weight: 800;
    font-size: 25px;
    line-height: 1.5;
    /* -webkit-text-stroke-width: 0.8px; */
    /* -webkit-text-stroke-color: var(--color3); */
}

/* -----------------------------------------　#con3　▲----------------------------------------------------- */



/* ----------------------------------------------------　#topCms　▼---------------------------------------- */
#topCms {
    background-image: url(/Files/img/bg_img.png);
    background-color: var(--color5);
    background-repeat: repeat;
    background-size: auto;
    z-index: 1;
}

#topCms .cmstitle p {
    font-family: var(--font-en);
    color: #fff;
    font-size: 18px;
    background-color: var(--color1);
    display: inline-block;
    border-radius: 50px;
    padding-left: 30px;
    padding-right: 30px;
    /* padding-top: 0; */
    margin-top: 20px;
}

.cmstitle .en {
    color: var(--color3);
    font-weight: 800;
    /* text-shadow: var(--white) 2px 2px 0, var(--white) -2px -2px 0, var(--white) -2px 2px 0, var(--white) 2px -2px 0, var(--white) 0px 2px 0, var(--white) 0 -2px 0, var(--white) -2px 0 0, var(--white) 2px 0 0; */
}

.cmstitle .jp {
    color: var(--color1);
    font-family: var(--font-en);
}

.cmstitle .jp span{
    color: var(--color1);
}

.cmstitle {
    background-image: url(/Files/img/penki.png);
    background-repeat: no-repeat;
    background-position: 40% 0%;
    background-size: 110px;
    padding: 40px 0 20px;
    z-index: 7;
}

/* ----------------------------------------------------　#topCms　▲---------------------------------------- */

/* ----------------------------------------------------　#footer　▼---------------------------------------- */
.footer {
    padding: 110px 0px 1px;
    background-image: url(/Files/img/rice-paper.png);
    background-size: auto;
    background-color: var(--color4);
}

.footer_contact h4 {
    line-height: 1.5;
    font-size: 30px;
    font-weight: bold;
}

.fix_banner {
    width: 300px;
    position: fixed;
    bottom: 5px;
    right: 100px;
    z-index: 9;
}

.f_sitemap_inner {
    margin-top: 20px;
}

.f_contact_box {
    border-radius: 10px;
    z-index: 1;
    background-color: var(--color5);
}

.footer a {
    font-size: 15px;
    font-weight: 900;
    /* background-color: var(--color5); */
    color: var(--color5);
}


.footertxt {
    font-weight: 900;
    color: var(--color5);
}

.PageFooter {
    font-size: 13px;
}

.f_sitemap_inner i {
    color: var(--color5);
}

.f_contact_btn a {
    margin: 0 auto;
    font-size: 18px;
    padding: 20px 0px 20px 38px;
    background-color: var(--color4);
    color: var(--color5);
    transition: 0.3s;
    border-radius: 50px;
    background-image: url(/Files/img/rice-paper.png);
}

.f_contact_btn a:hover{
    background-color: var(--color1);
/*     color: var(--black); */
}

.f_contact_btn i{
    margin-left: -45px;
    line-height: 1.2;
    font-size: 30px;
}

.copy {
    background-color: var(--color5);
    color: var(--black);
    padding: 15px 0;
}

.pagetop {
    border-radius: 10px;
    z-index: 10;
}

/* ----------------------------------------------------　#footer　▲---------------------------------------- */
/* -----------------------------------------------------------------------------------------------　下層ページ　--------------------------------------------------------------------------------------------------------- */
.pagetitle p,.pagetitle p span{
    COLOR: var(--color5);
}

#page9 .privacy .box {
    background-color: #ffffff00;
}

/*  -----------------------------------　お知らせ　▼ ----------------------------------- */

#cms_6-d .cate_title {
    color: var(--color3);
}

/*  -----------------------------------　お知らせ　▲ ----------------------------------- */

/*  -----------------------------------　会社事業　▼- ------------------------------------ */

.flow_type1 .cate_box{border-left:none;background-color: rgba(0,0,0,0);}
.flow_type1 .box_txt1,
.flow_type1 .box_txt2{padding-left:130px;}

.flow_type1 .box_wrap{
    position: relative;
    padding-left: 30px;
}
.flow_type1 .box_wrap:before{
    content: "";
    display: inline-block;
    height: calc(100% - 0px);
    border-left: 14px solid var(--color2);
    position: absolute;
    top: -5px;
    left: 107px
}
.flow_type1 .box_txt1{position:relative;color: var(--color3);}
.flow_type1 .box_txt1::before,
.flow_type1 .box_txt1::after {
	content: "";
	display: block;
	position: absolute;
	top: 18px;
}
.flow_type1 .box_txt1::before {
	width: 7px;
	height: 7px;
	margin-top: -3px;
	background: var(--color4);
	border-radius: 50%;
	left: 61.5px;
}
.flow_type1 .box_txt1::after {
	width: 50px;
	border-bottom: 1px dashed var(--color4);
	position: absolute;
	left: 72px;
}
.flow_type1 .box_description2{
    position: relative;
    border-left: none;
    background-color: rgba(255, 255, 255, 0);
}
.flow_type1 .box_description2 span{
position: absolute;
    display: inline-block;
    width: 90px;
    top: -23px;
    left: -50px;
}
/*--------タブレット--------*/
@media screen and (max-width: 768px){
.flow_type1 .flex_order2_tb{
    width: 78%!important;
    margin-left: auto;
}
}
/*--------スマートフォン--------*/
@media screen and (max-width: 667px){
.flow_type1 .box_description2 span {
    width: 70px;
}
.flow_type1 .box_wrap{
    padding-left: 23px;
}
.flow_type1 .box_wrap:before {
    left: 22px;
}
.flow_type1 .box_txt1::before, .flow_type1 .box_txt1::after {
    top: 58px;
}
.flow_type1 .box_txt1::before {
    margin-top: -3px;
    left: -17.5px;
}
.flow_type1 .box_txt1::after {
    width: 30px;
    left: -8px;
}
.flow_type1 .box_txt1, .flow_type1 .box_txt2 {
    padding-left: 30px;
}
.flow_type1 .box_txt1{
    padding-top: 46px;
}
.flow_type1 .flex_order2_tb {
    width: 87%!important;
}
}

/*  ------------------------------------　会社事業　▲- ----------------------------------- */

/* -----------------------------------　お客様の声　▼*  -----------------------------------*/

.v_type1 .triangle {
    display: block;
    border-radius: 5px;
    border: var(--color3) solid 2px;
    background-color: var(
    --color5);
    box-shadow: 5px 5px 0 0 var(--color3);
}

.v_type1 .triangle:before {
    content: '';
    position: absolute;
    display: block;
    z-index: 1;
    border-style: solid;
    border-color: #FFF transparent;
    border-width: 13px 13px 0 0;
    bottom: -13px;
    left: 50%;
    margin-left: -9px;
}

.v_type1 .triangle:after {
    content: '';
    position: absolute;
    display: block;
    z-index: 0;
    border-style: solid;
    border-color: var(--color3) transparent;
    border-width: 17px 22px 0 0;
    bottom: -20px;
    left: 50%;
    margin-left: -11px;
    border-radius: 5px;
}

/* -----------------------------------　お客様の声　▲*  ----------------------------------- */

/*  -----------------------------------　よくある質問 ▼ ----------------------------------- */

.qa_type3 .con_no{
	left: 20px;
	top: 15px;
}

.qa_type3 .cate_box .box_title1, .qa_type3 .cate_box .box_txt1{
	min-height: 1.5em
}

.qa_type3 .box_q{
	background-image: url(/Files/img/icon_q.png);
	background-repeat: no-repeat;
	background-position: top 2px left;
	background-size: 60px
}

.qa_type3 .box_a{
	background-image: url(/Files/img/icon_a.png);
	background-repeat: no-repeat;
	background-position: top 2px right;
	background-size: 60px;
	font-weight: 900;
}

.qa_type3 .box_q, .qa_type3 .box_a{
	padding: 0 10px;
}

.qa_type3 .box_q .box_title1::before, .qa_type3 .box_a .box_txt1::before{
    border: solid #ffffff;
    content: '';
    height: 0;
    width: 0;
    pointer-events: none;
    position: absolute;
    border-color: rgba(0, 0, 0, 0);
}

.qa_type3 .box_q .box_title1::before{
    border-top-width: 7px;
    border-bottom-width: 7px;
    border-left-width: 10px;
    border-right-width: 15px;
    margin-top: -10px;
    /* background-color: var(--color1); */
    border-right-color: var(--color3);
    right: 100%;
    top: 34px;
}

.qa_type3 .cate_box .box_title1 .con_no {
    color: var(--color3);
}

.qa_type3 .cate_box .box_txt1 {
    background-color: var(--color5);
    border: solid 2px var(--color1);
    box-shadow: 5px 5px 0 0 var(--color1);
    color: var(--black);
    font-weight: 900;
    border-radius: 5px;
}

.qa_type3 .cate_box .box_txt1 .con_no {
    color: var(--color1);
}

.qa_type3 .cate_box .box_title1 {
    background-color: var(--color5);
    border: solid 2px var(--color3);
    box-shadow: 5px 5px 0 0 var(--color3);
    color: var(--color3);
    font-weight: 900;
    border-radius: 5px;
}

.qa_type3 .box_a .box_txt1::before{
    border-top-width: 7px;
    border-bottom-width: 7px;
    border-left-width: 15px;
    border-right-width: 10px;
    margin-top: -10px;
    border-left-color: var(--color1);
    border-radius: 0px 10px 10px 0px;
    left: 100%;
    top: 35px;
}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
.qa_type3 .box_q{
	padding-right: 0
}

.qa_type3 .box_a{
	padding-left: 0
}

.qa_type3 .con_no{
    top: 13px;
}

}

/*  -----------------------------------　よくある質問 ▲ ----------------------------------- */



/* *  -----------------------------------　1日の流れ　▼*  ----------------------------------- */
/* *  -----------------------------------　1日の流れ　▲*  ------------------------------------ */

/* -----------------------------------　お問い合わせ　▼*  -----------------------------------*/
/* -----------------------------------　お問い合わせ　▲*  ----------------------------------- */

/* *  -----------------------------------　プライバシーポリシー ▼*  ----------------------------------- */

#page9 .box .no {
    background-color: var(--color3);
}

#page9 .privacy .box h3 {
    color: var(--color3);
}

/* *  -----------------------------------　プライバシーポリシー ▲*  -----------------------------------*/


/**  -----------------------------------　サイトマップ　▼*  ----------------------------------- */

#page10 .sitemap li a {
    background-color: var(--color3);
    transition: 0.3s;
}

#page10 .sitemap li a:hover {
    background-color: var(--color1);
    color: var(--black);
}

/**  -----------------------------------　サイトマップ　▲*  ---------------------------------- */


@media all and (-ms-high-contrast: none){
}
/*-------------------------------------------------------------------------------------------------------1700-------------------------------------------------------------------------------------------------------------*/

@media screen and (max-width: 1700px){
}

/*-------------------------------------------------------------------------------------------------------1536------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 1536px){

#main_img .catch {
    top: 48%;
    right: 56%;
    width: 42vw;
    height: 25%;
}

.con1_squ {
    height: 60px;
    bottom: -80px;
}

#con1 {
    padding-top: 15px;
    padding-bottom: 15px;
    background-position: 93% 95%, 5% 95%;
    background-repeat: no-repeat;
    background-size: 210px, 180px;
}

#con2 {
    padding-top: 75px;
    padding-bottom: 35px;
}

#con2 .img_wrap:before {
    top: 14%;
    left: 61%;
}

#con3 .title {
    /* background-position: 70% 106%; */
    /* background-size: 450px; */
    /* padding: 20px 0px 59px; */
}

#con3:after {
    bottom: -10%;
}

.cmstitle_img {
    width: 84vw;
}

}
/*-----------------------------------------------------------------------------------------------------1530 × 735---------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 1530px){

#main_img .catch {
    top: 46%;
    /* right: 56%; */
    /* width: 42vw; */
    /* height: 28%; */
}

.cmstitle_img {
    width: 84vw;
}

#con1 {
    padding-top: 5px;
}

#con3:after {
    bottom: -9%;
}

}

/*----------------------------------------------------------------------------------------------------------1366----------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 1366px){

#main_img .catch {
    top: 42%;
    right: 56%;
    width: 42vw;
    height: 23%;
}


#con1 {
    background-size: 160px, 140px;
    padding-bottom: 45px;
}


.cmstitle_img {
    width: 94vw;
}

.TopTxt04 {
    margin-bottom: 0px;
}

#con2 .title {
    background-position: 95% 101%;
    background-size: 250px;
    padding: 40px 0px 40px;
    line-height: normal;
}

#con3 .title {
    /* padding: 70px 0px 50px; */
    /* margin-bottom: 30px; */
}


#con3 .box_title1 {
    background-position: 7% 10%;
    background-size: 70px;
    padding: 20px 0px 20px;
}

#con3 .box_title2 {
    background-position: -5% 10%;
    background-size: 70px;
    padding: 20px 0px 20px;
}

#con3 .box_title3 {
    background-position: 5% 10%;
    background-size: 70px;
    padding: 20px 0px 20px;
}


}

/*----------------------------------------------------------------------------------------------------------1280----------------------------------------------------------------------------------------------------------*/
@media  screen and (max-width: 1280px){

#con2 .img_wrap:before {
    left: 60%;
}

#con2:after {
    width: 20vw;
    bottom: -15%;
    left: 17%;
}



}

/*---------------------------------------------------------------------------------------------------------1000----------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 1000px){

.pc_nav li {
    padding-top: 0;
    padding-right: 0;
    padding-left: 10px;
}

.pc_nav li a {
    background-size: 40px auto;
    padding: 40px 0px 0;
}

.TopTxt02 {
    font-size: 38px;
}

.loopSlider_wrap{right: 40px;}

}

@media all and (-ms-high-contrast: none){
  .sample{

  }
}


/*--------------------------------------------------------------------------------------------------------タブレット------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 768px){
.header .logo1 {
    max-width: 190px;
}

.header-in {
    height: 100px;
    /* background-color: transparent; */
}

.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, #con3 .box_title, .cate_list li a, .cate_title {
    letter-spacing: 0px;
}

#main_img {/* padding-top: 0px; */height: 93vh;}

#main_img .catch {
    top: 56%;
    right: 4%;
    width: 92vw;
    /* height: 22%; */
}

#con1 {
    background-color: var(--color2);
}

.con1_squ {
    height: 60px;
    bottom: -40px;
}

.topTxt1 {
    background-color: transparent;
    color: var(--color3);
    border-bottom: solid 2px;
    border-radius: 0;
    font-size: 28px;
}

.topTxt1 .arrow {
    color: var(--color3);
}

.topTxt1 .arrow{
    margin-left: 0;
    transform: translateX(-50%);
    bottom: -16px;
}

.TopTxt02 {
    color: var(--color3);
    font-size: 40px;
}

.TopTxt02 {
    font-size: 40px;
    line-height: normal;
    text-align: center;
}

.TopTxt03 {
    left: 0;
    right: 0;
    margin: auto;
    width: 600px;
}

.TopTxt04 {
    font-size: 40px;
    margin-bottom: 10px;
}


#con1 .title {
    background-position: 100% 90%;
    background-size: 350px;
    padding: 0px 0px 60px;
    margin-bottom: 0px;
}


#con3 {
    padding: 50px 0;
}

#con3 .title {
    /* background-position: 92% 96%; */
    /* padding: 50px 0px 30px; */
    /* margin-bottom: 30px; */
    /* background-size: 400px; */
}

#con3 .box_title1 {
    background-position: 0% 70%;
    background-size: 90px;
    padding: 40px 0px 10px;
    margin: 0;
    font-size: 27px;
}

#con3 .box_title2 {
    background-position: 4% 70%;
    background-size: 90px;
    padding: 40px 0px 10px;
    margin: 0;
}

#con3 .box_title3 {
    background-position: 4% 70%;
    background-size: 90px;
    padding: 40px 0px 10px;
    margin: 0;
}

.box_title {
    color: var(--color3);
    font-size: 35px;
    line-height: 1.8;
    /* -webkit-text-stroke-width: 0.8px; */
    /* -webkit-text-stroke-color: var(--color3); */
}

.fix_banner {
    width: 430px;
    right: 180px;
    margin: auto;
}

.cmstitle {
    background-position: 38% -5%;
    background-size: 90px;
    padding: 30px 0 2px;
    margin-bottom: 10px;
}
.cmstitle .en {
    font-size: 40px;
}

.cmstitle .jp {
    font-size: 20px;
}

.cmstitle_img {
    width: 90vw;
}

.logo1 {max-width: 145px;}

.menu_btn{border: none;box-shadow: none;}

.pagetitle .jp span {
    padding-top: 6px;
}

.header .logo1 {
    padding: 10px 20px 10px;
}



.footer_contact:before {
    height: 11vh;
    top: -1%;
}
/* ----------　con1　▼---------- */
#con1 {
    padding-top: 1px;
    padding-bottom: 90px;
    background-position: 97% 97%, 2% 97%;
    background-repeat: no-repeat;
    background-size: 140px, 100px;
}

#con1:after{
    width: 15vw;
    height: 11vw;
    bottom: -20vw;
}
/* ----------　con1　▲---------- */

/* ----------　con2　▼---------- */

#con2 {
    padding-top: 90px;
    padding-bottom: 40px;
}

#con2:before {
    top: -5px;
    height: 11vw;
}
/* ----------　con2　▲---------- */

/* ----------　con3　▼---------- */
#con3 {
    padding: 20px 0 30px;
}

#con3:before {
    width: 100%;
    height: 11vw;
    top: 0%;
}



#con3:after {
    width: 100%;
    /* height: 11vw; */
    bottom: 7%;
}

#con3 .box .img {
    max-width: 450px;
    height: 450px ! IMPORTANT;
    margin: 0 auto;
    border-radius: 20px;
}

#con3 .txt br{display:none;}

.f_sitemap_inner{
    justify-content: left;
}

.f_sitemap_inner li{
    width: 33.3%;
}

.v_type1 .triangle .box_title {
    font-size: 23px;
}

}
/*---------------------------------------------------------------------------------------------------------スマホ---------------------------------------------------------------------------------------------------------*/

@media screen and (max-width: 667px){
.con1_squ {
    height: 50px;
    bottom: -60px;
}

.header-in {
    height: 90px;
    /* background-color: transparent; */
}

.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, #con3 .box_title, .cate_list li a, .cate_title {
    letter-spacing: 0px;
}

#main_img {padding-top: 70px;height: 70vh;}

#main_img .catch {
    top: 57%;
    right: 4%;
    width: 92vw;
    height: 17%;
}

.header .logo1{
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
}

.header .logo1 {
    max-width: 160px;
    padding: 10px 10px 0px;
}

.logo1:hover, .pc_nav li:hover {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
}

.menu_btn {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
}

.logo1 {max-width: 100px;}

#con1 .denkyu {
    width: 10vw;
    left: 45.5%;
}

.topTxt1 {
    letter-spacing: 0;
    font-size: 15px;
    max-width: 100%;
}

.TopTxt02 {
    font-size: 28px;
}

.TopTxt02 {
    font-size: 26px;
    text-align: center;
    letter-spacing: -1px;
    margin-top: 20px;
    margin-bottom: 10px;
    line-height: normal;
}

.TopTxt03 {
    left: 0;
    right: 0;
    margin: auto;
    line-height: 1.8;
    width: 290px;
    font-size: 16px !important;
}

.TopTxt04 {
    font-size: 26px;
    letter-spacing: 0;
    line-height: normal;
}

.fix_banner {
    width: 200px;
    right: 70px;
}

.footertxt{max-width: 100%;}

.footer_sns .box a {
    padding: 10px 10px 10px;
}

#con1 {
    padding-top: 20px;
    padding-bottom: 5px;
}

#con1 .title {
    background-position: 100% 90%;
    background-size: 240px;
    padding: 0px 0px 40px;
    margin-bottom: 0px;
}


#con2 {
    padding-top: 80px;
    padding-bottom: 15px;
}

#con2:before {
    top: -1%;
    height: 57px;
}

#con2 .topimg3:before{
width: 14vw;
height: 20vw;
top: 0;
}

#con3 .title {
    /* padding: 30px 0px 30px; */
    /* margin-bottom: 10px; */
    /* background-size: 200px; */
    /* background-position: 92% 100%; */
}

#con3 .box_title1 {
    background-position: 0% 70%;
    background-size: 90px;
    padding: 10px 0px 0px;
    margin: 0;
    font-size: 27px;
}

#con3 .title .en {
    font-size: 30px;
    letter-spacing: 0;
}

#con3 .box .img {
    max-width: 300px;
    height: 300px ! IMPORTANT;
}

/*---------------------------------------------　#con1　▼-------------------------------------------------- */
#con1 {
    background-color: var(--color2);
    background-size: 0;
}

#con1 .denkyu {
    width: 6vw;
    top: 0;
    text-align: center;
    margin: auto 0;
    left: 46.5%;
}

#con1 .denkyu .denkyu_img {
    visibility: visible;
    animation-duration: 5s;
    animation-delay: 5s;
    animation-iteration-count: 3;
    animation: swing 1.2s;
}



.topTxt1 {
    background-color: transparent;
    color: var(--color3);
    border-bottom: solid 2px;
    border-radius: 0;
    font-size: 28px;
}

.topTxt1 .arrow {
    color: var(--color3);
}

.topTxt1 .arrow{
    margin-left: 0;
    transform: translateX(-50%);
    bottom: -16px;
}

/* ---------------------------------------------　#con1　▲------------------------------------------------- */

/* ---------------------------------------------　#con2　▼------------------------------------------------- */

/* ---------------------------------------------　#con2　▲------------------------------------------------- */

/* -----------------------------------------　#con3　▼----------------------------------------------------- */
#con3 {
    padding: 50px 0;
    background-color: var(--color2);
}

.box_title {
    color: var(--color3);
    font-size: 25px;
    line-height: 1.8;
    /* -webkit-text-stroke-width: 0.8px; */
    /* -webkit-text-stroke-color: var(--color3); */
}

/* -----------------------------------------　#con3　▲----------------------------------------------------- */

#con3 {
    padding: 40px 0 10px;
}

#con3:before {
    height: 63px;
    top: -0.5%;
}

#con3:after {
    /* height: 63px; */
    /* bottom: -63px; */
}

#topCms {
    padding: 30px 0;
}

#topCms:after {
    height: 42px;
    top: 0%;
}

.footer {
    background-size: 210% auto;
    background-position: 0% calc(100% + 1px);
}

.footer_contact:before {
    top: -5%;
}

.cate_list li a {
    letter-spacing: 0;
    font-size: 13px;
}

.cmstitle:before{
width: 50px;
height: 50px;
top: -60px;
}

.cmstitle {
    background-position: 20% 0%;
    background-size: 70px;
    padding: 30px 0 2px;
    margin-bottom: 10px;
}
.cmstitle .en {
    font-size: 30px;
}

.cmstitle .jp {
    font-size: 15px;
}

.pagetitle{
padding-top: 150px;
padding-bottom: 80px;
}

.pagetitle:after{
width: 80px;
height: 145px;
top: 175px;
}

.footer {
    padding: 110px 0px 10px;
}

.footer_sns {
    margin-bottom: 0px;
    padding: 10px;
}


.pagetop {
    right: 10px;
    bottom: 60px;
}

#page2,#page3,#page4,#page5,#page6,#page7,#page8,#page9,#page10{
    font-size: 18px!important;
}

#page2,#page3,#page4,#page5,#page6,#page7,#page8,#page9,#page10{
    font-size: 14px!important;
}

#page8 .contact_tel a {
    padding: 18px 20px;
    border-radius: 50px;
    transition: .3s;
    font-size: 18px;
}

#page9 .privacy .box {
    padding: 5%;
}

.privacy .box h3 {
    letter-spacing: 0;
    font-size: 15px;
}

}

.cate_list li a {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 10px;
    font-weight: bold;
}


/*------------------------------------------------------------------------------イラスト追加------------------------------------------------------------------------------*/
#con2 .con2_left, #con2 .con2_right {
    background-size: 100%;
    width: 16vw;
    height: 16vw;
    z-index: 10;
}

#con2 .con2_left,#con2 .con2_right{
    background-size: 100%;
    width: 15vw;
    height: 13vw;
    z-index: 3;
}





/*----------------------------------------------------------------------------------------------------------1366----------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 1366px){

#con1 .con1_left{
        bottom: -12%;
        left: 2%;
}

#con1 .con1_right{
        bottom: -15%;
        right: 2%;
}

#con2 .con2_left{
        bottom: -35%;
        left: 5%;
}

#con2 .con2_right{
        bottom: -35%;
        right: 5%;
}

}


/*----------------------------------------------------------------------------------------------------------768----------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 768px){

 #con2 .con2_left, #con2 .con2_right {
    background-size: 100%;
    width: 25vw;
    height: 21vw;
}

#con2 .con2_left{
        bottom: -8%;
        left: 5%;
}

#con2 .con2_right{
        bottom: -8%;
        right: 5%;
}

}

/*----------------------------------------------------------------------------------------------------------667----------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 667px){
#con2:before{
    top: 0;
    height: 100px;
}

 #con2 .con2_left, #con2 .con2_right {
    width: 33vw;
    height: 28vw;
}

#con1 .con1_left{
        bottom: -7%;
        left: 5%;
}

#con1 .con1_right{
        bottom: -7%;
        right: 5%;
}

#con2 .con2_left{
        bottom: -5%;
        left: 5%;
}

#con2 .con2_right{
        bottom: -5%;
        right: 5%;
}

}

@media screen and (max-width: 320px){
#sp_nav .sp_nav_inner{padding: 15px 0px 50px 0px;}
    	
#sp_nav .sp_nav_inner .menu__header{padding: 3% 8% 3%;}

#sp_nav .sp_nav_inner .l-menu{padding: 2% 8% 2%;}

#sp_nav .sp_nav_inner .l-menu ul li{padding: 3px 0;}
.f_contact_btn a {
    font-size: 15px;
    width: 250px;
}

#con3 .title .en {
    font-size: 21px;
}

#con3 .box_title1 {
    font-size: 21px;
}
}