@charset "utf-8";

/*! destyle.css v4.0.0 | MIT License | https://github.com/nicolas-cusan/destyle.min.css */
*,::before,::after{box-sizing:border-box;border-style:solid;border-width:0}html{line-height:1.15;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}body{margin:0}main{display:block}p,table,blockquote,address,pre,iframe,form,figure,dl{margin:0;transform: rotate(0.05deg);}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit;margin:0;transform: rotate(0.05deg);}ul,ol{margin:0;padding:0;list-style:none}dt{font-weight:500}dd{margin-left:0}hr{box-sizing:content-box;height:0;overflow:visible;border-top-width:1px;margin:0;clear:both;color:inherit}pre{font-family:monospace,monospace;font-size:inherit}address{font-style:inherit}a{background-color:transparent;text-decoration:none;color:inherit}abbr[title]{text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:inherit}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}svg,img,embed,object,iframe{vertical-align:bottom}button,input,optgroup,select,textarea{-webkit-appearance:auto;appearance:auto;vertical-align:middle;color:inherit;font:inherit;background:transparent;padding:0;margin:0;border-radius:0;text-align:inherit;text-transform:inherit}button,[type="button"],[type="reset"],[type="submit"]{cursor:pointer}button:disabled,[type="button"]:disabled,[type="reset"]:disabled,[type="submit"]:disabled{cursor:default}:-moz-focusring{outline:auto}select:disabled{opacity:inherit}option{padding:0}fieldset{margin:0;padding:0;min-width:0}legend{padding:0}progress{vertical-align:baseline}textarea{overflow:auto}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{outline-offset:-2px}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}[type="number"]{-moz-appearance:textfield}label[for]{cursor:pointer}details{display:block}summary{display:list-item}[contenteditable]:focus{outline:auto}table{border-color:inherit;border-collapse:collapse}caption{text-align:left}td,th{vertical-align:top;padding:0}th{text-align:left;font-weight:700}

em {font-style: italic;}

html{ scroll-behavior: smooth;}
html,body{ width:100%;height:100%;-webkit-font-smoothing: antialiased;scroll-behavior: smooth;}
html,body{ }


.over {transition: 0.3s ;}
.over:hover {opacity: 0.5 ;}

/*clearfix*/
.clearfix:after{content: "."; display: block; height: 0; font-size:0; clear: both; visibility:hidden}
.clearfix{display: inline-block;}
* html .clearfix{height: 1%;}
.clearfix{display:block;}
 


/*========================================
BASIC
=======================================*/

html{-webkit-text-size-adjust:100%; font-size: 62.5%;}
body{font-size: 10px;font-size: 1.0rem; color:#22385d; font-family: YakuHanJP, "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; background-color:#ffffff; font-weight: 500;}
_::-webkit-full-page-media, _:future, :root body {font-family: YakuHanJP, "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;}
@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}


/* ios Safari */
@supports (-webkit-touch-callout: none) {body {height: -webkit-fill-available;}}

a{color:#00afcc; text-decoration:none;}
a:hover{color: #005ca1;}

/* alllink */
a.all {position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 5; }

#container {width: 100%; height: auto; padding: 0 0 0 0; opacity: 1; overflow: clip; position: relative;}

main {}
@media screen and (max-width: 768px) {
main {}
}


/* --- page link --- */
.page_link{margin-top: -120px;padding-top: 120px; display:block; z-index: -1;position: relative;}
.pc {}
.sp { display: none;}

@media screen and (max-width: 768px) {
#container {padding: 0 0 0 0;}
}

@media screen and (max-width: 768px) {

/* --- page link --- */
.page_link{margin-top: -110px;padding-top: 110px; display:block;}
.pc { display: none;}
.sp { display: inherit;}
.over:hover {opacity: 1 ;}
}



/* page-top */
#page-top {position: fixed;bottom: 20px;right: 20px;z-index:100; max-width:50px; height:auto;transition: 0.5s;-webkit-transition: 0.5s;}
#page-top img {max-width:50px; height:auto;transition: 0.5s;-webkit-transition: 0.5s;}
#page-top:hover {transform: translate(0,-10px);}

/* hr */
hr{}

/* icons */
@font-face {
  font-family: 'icomoon';
  src:  url('fonts/icomoon.eot?s7p13y');
  src:  url('fonts/icomoon.eot?s7p13y#iefix') format('embedded-opentype'),
    url('fonts/icomoon.ttf?s7p13y') format('truetype'),
    url('fonts/icomoon.woff?s7p13y') format('woff'),
    url('fonts/icomoon.svg?s7p13y#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-right_arrow:before {
  content: "\e901";
}
.icon-instagram:before {
  content: "\e90b";
}
.icon-x:before {
  content: "\e90c";
}
.icon-youtube:before {
  content: "\e90d";
}
.icon-facebook:before {
  content: "\e90e";
}
.icon-open:before {
  content: "\e900";
}
.icon-mail:before {
  content: "\e90f";
}
.icon-tel:before {
  content: "\e910";
}




@media(min-width: 768px){a[href^="tel:"]{pointer-events: none;text-decoration: none;color: inherit;}}

.txt_idt_1{text-indent: -1em;padding-left: 1em;}
.txt_idt_2{text-indent: -2em;padding-left: 2em;}
.txt_idt_3{text-indent: -3em;padding-left: 3em;}
.txt_idt_4{text-indent: -4em;padding-left: 4em;}

/* bottomspace */
@media(max-width: 768px){
.gap_00 {gap:0!important;}
}

/* bottomspace */
.mb_00 {margin-bottom: 0!important;}
.mb_10 {margin-bottom: 10px!important;}
.mb_15 {margin-bottom: 15px!important;}
.mb_20 {margin-bottom: 20px!important;}
.mb_25 {margin-bottom: 25px!important;}
.mb_30 {margin-bottom: 30px!important;}
.mb_35 {margin-bottom: 35px!important;}
.mb_40 {margin-bottom: 40px!important;}
.mb_45 {margin-bottom: 45px!important;}
.mb_50 {margin-bottom: 50px!important;}
.mb_55 {margin-bottom: 55px!important;}
.mb_60 {margin-bottom: 60px!important;}
.mb_65 {margin-bottom: 65px!important;}
.mb_70 {margin-bottom: 70px!important;}
.mb_80 {margin-bottom: 80px!important;}
.mb_90 {margin-bottom: 90px!important;}
.mb_100 {margin-bottom: 100px!important;}

/* text size*/
.txt_12 {font-size: 1.2rem!important;}
.txt_14 {font-size: 1.4rem!important;}
.txt_16 {font-size: 1.6rem!important;}
.txt_18 {font-size: 1.8rem!important;}
.txt_20 {font-size: 2rem!important;}
.txt_22 {font-size: 2.2rem!important;}
.txt_24 {font-size: 2.4rem!important;}
.txt_26 {font-size: 2.6rem!important;}
.txt_28 {font-size: 2.8rem!important;}
.txt_30 {font-size: 3rem!important;}
.txt_32 {font-size: 3.2rem!important;}
.txt_34 {font-size: 3.4rem!important;}
.txt_36 {font-size: 3.6rem!important;}
.txt_38 {font-size: 3.8rem!important;}
.txt_40 {font-size: 4rem!important;}
.txt_42 {font-size: 4.2rem!important;}
.txt_50 {font-size: 5rem!important;}


@media screen and (max-width: 768px) {
/* bottomspace */
.mb_10 {margin-bottom: 2vw!important;}
.mb_15 {margin-bottom: 3vw!important;}
.mb_20 {margin-bottom: 4vw!important;}
.mb_25 {margin-bottom: 5vw!important;}
.mb_30 {margin-bottom: 6vw!important;}
.mb_35 {margin-bottom: 7vw!important;}
.mb_40 {margin-bottom: 8vw!important;}
.mb_45 {margin-bottom: 9vw!important;}
.mb_50 {margin-bottom: 10vw!important;}
.mb_55 {margin-bottom: 11vw!important;}
.mb_60 {margin-bottom: 12vw!important;}
.mb_65 {margin-bottom: 13vw!important;}
.mb_70 {margin-bottom: 14vw!important;}
.mb_80 {margin-bottom: 16vw!important;}
.mb_90 {margin-bottom: 18vw!important;}
.mb_100 {margin-bottom: 20vw!important;}

/* text size*/
.txt_12 {font-size: 1rem!important;}
.txt_14 {font-size: 1.2rem!important;}
.txt_16 {font-size: 1.4rem!important;}
.txt_18 {font-size: 1.6rem!important;}
.txt_20 {font-size: 1.8rem!important;}
.txt_22 {font-size: 2rem!important;}
.txt_24 {font-size: 2rem!important;}
.txt_26 {font-size: 2rem!important;}
.txt_28 {font-size: 2.2rem!important;}
.txt_30 {font-size: 2.2rem!important;}
.txt_32 {font-size: 2.4rem!important;}
.txt_34 {font-size: 2.6rem!important;}
.txt_36 {font-size: 2.8rem!important;}
.txt_38 {font-size: 3rem!important;}
.txt_40 {font-size: 3rem!important;}
.txt_42 {font-size: 3rem!important;}
}

/* text line-height*/
.txt_l10 {line-height: 1!important;}
.txt_l11 {line-height: 1.1!important;}
.txt_l12 {line-height: 1.2!important;}
.txt_l13 {line-height: 1.3!important;}
.txt_l14 {line-height: 1.4!important;}
.txt_l15 {line-height: 1.5!important;}
.txt_l16 {line-height: 1.6!important;}
.txt_l17 {line-height: 1.7!important;}
.txt_l18 {line-height: 1.8!important;}
.txt_l19 {line-height: 1.9!important;}
.txt_l20 {line-height: 2!important;}

/* text weight*/
.txt_w400 {font-weight: 400!important;}
.txt_w500 {font-weight: 500!important;}
.txt_w600 {font-weight: 600!important;}
.txt_w700 {font-weight: 700!important;}
.txt_w800 {font-weight: 800!important;}

/* text color*/
.c_00afcc {color: #00afcc!important;}
.c_8ec724 {color: #8ec724!important;}
.c_f38470 {color: #f38470!important;}
.c_f48570 {color: #f48570!important;}
.c_666666 {color: #666666!important;}
.c_1b1c80 {color: #1b1c80!important;}
.c_ffffff {color: #ffffff!important;}
.c_f08d1d {color: #f08d1d!important;}



/* bg color*/
.bgc_e7f5f2 { background-color: #e7f5f2!important;}
.bgc_fde7e2 { background-color: #fde7e2!important;}


/* 強調*/
.attention {width: auto; display: flex; flex-direction: row; justify-content: center; align-items:center; gap:10px; margin:0 auto;}
.attention:before {content: "＼";font-size: 1.2em; font-weight: 400;}
.attention:after {content: "／";font-size: 1.2em;font-weight: 400;}
       

.txt_center {text-align: center!important;}
.txt_left {text-align: left!important;}
.txt_right {text-align: right!important;}



/* ボタン*/
a.links {width: auto; height: 46px;font-size: 1.6rem; font-weight: 400; display:inline-flex; justify-content: space-between;align-items: center; position: relative; border: 1px solid #b8c3d1; color: #113866; padding: 0 45px 0 15px; border-radius: 23px;-webkit-transition: all .3s;transition: all .3s;}
a.links::after {content:"\e90f";font-family: "icomoon"; font-size: 1.4em; position: absolute; color: #587494;  right:15px;-webkit-transition: all .3s;transition: all .3s;}

a.links_left {width: auto; height: 46px;font-size: 1.6rem; font-weight: 400; display:inline-flex; justify-content: flex-end;align-items: center; position: relative; border: 1px solid #b8c3d1; color: #113866; padding: 0 15px 0 50px; border-radius: 23px;-webkit-transition: all .3s;transition: all .3s;}
a.links_left::before {content:"\e900";font-family: "icomoon"; font-size: 1.4em; position: absolute; color: #587494;  left:15px;-webkit-transition: all .3s;transition: all .3s;}


/* サイドボタン*/
.side_contents a.links {width: 100%!important;}

.btn_center {margin: 0 auto!important;}
.btn_blank::after {content:"\e910"!important; font-size: 1.2em;}
.btn_pdf::after {content:"\e909"!important; font-size: 1.2em;}
.btn_instagram::after {content:"\e90b"!important; font-size: 1em;}



@media screen and (min-width: 768px) {
a.links:hover {border: 1px solid #fe6b02; color: #ffffff; background: #fe6b02;}
a.links_left:hover {border: 1px solid #fe6b02; color: #ffffff; background: #fe6b02;}
a.links:hover::after {right:10px;color: #ffffff; }
a.links_left:hover::before {left:10px;color: #ffffff; }
}
@media screen and (max-width: 768px) {
a.links,a.links_left {max-width: auto; height: 40px;font-size: 1.4rem; border-radius: 20px;}
a.links::after,a.links_left::before { font-size: 1.2em; }
a.links span span{display: none;}
}

/* reCAPTCHAマーク非表示*/
.grecaptcha-badge { visibility: hidden; }




/*========================================
WP
=======================================*/

.wp_txt {width: 100%;}
.wp_txt img{max-width: 100%;}
.wp_txt h1 {width: 100%; font-size: 3rem; font-weight:400; color:#22385d; line-height:1.5; border-bottom:1px dotted #b8c3d1; padding-bottom:20px;  margin-bottom:30px;}
.wp_txt h2 {width: 100%; font-size: 2.6rem; font-weight:400; color:#22385d; line-height:1.5; border-bottom:1px dotted #b8c3d1; padding-bottom:10px;  margin-bottom:20px;}
.wp_txt h3 {width: 100%; font-size: 2.2rem; font-weight:400; color:#22385d; line-height:1.5; border-bottom:1px dotted #b8c3d1; padding-bottom:10px;  margin-bottom:20px;}
.wp_txt h4 {width: 100%; font-size: 1.8rem; font-weight:400; color:#22385d; line-height:1.5; border-bottom:none; margin-bottom:20px;}
.wp_txt h5 {width: 100%; font-size: 1.6rem; font-weight:400; color:#22385d; line-height:1.5; margin-bottom:10px;}
.wp_txt h6 {width: 100%; font-size: 1.4rem; font-weight:400; color:#22385d; line-height:1.5; }
.wp_txt p {font-size: 1.6rem; font-weight:400; color:#22385d; line-height:2; }


/* --- WP pagenation --- */
.pagination{margin:100px auto 0 auto;}
.nav-links{display:flex; flex-direction: row; justify-content: center; align-items: center;}
.pagination .page-numbers{font-size: 1.6rem; width: 40px; height: 40px; margin-right:10px;color:#22385d;border-radius:3px;background:#ffffff; display:flex; flex-direction: row; justify-content: center; align-items: center; flex-wrap: nowrap;transition: all 0.3s;}
.pagination .page-numbers:hover {background:#fe6b02; color: #ffffff;}
.pagination .current{padding:15px;background:#22385d;color:#fff;}
.pagination .current:hover{background:#22385d;color:#fff;}
.pagination .prev,.pagination .next{background:transparent;box-shadow:none;color:#fe6b02;width: auto;}
.pagination .prev:hover,.pagination .next:hover{box-shadow:none;color:#22385d;width: auto;background:none;}
.pagination .dots{background:transparent;box-shadow:none;}

@media screen and (max-width: 768px) {
.wp_txt h1 {width: 100%; font-size: 2.4rem; font-weight:400; color:#22385d; line-height:1.5; border-bottom:1px dotted #b8c3d1; padding-bottom:15px;  margin-bottom:20px;}
.wp_txt h2 {width: 100%; font-size: 2rem; font-weight:400; color:#22385d; line-height:1.5; border-bottom:1px dotted #b8c3d1; padding-bottom:5px;  margin-bottom:15px;}
.wp_txt h3 {width: 100%; font-size: 1.8rem; font-weight:400; color:#22385d; line-height:1.5; border-bottom:1px dotted #b8c3d1; padding-bottom:5px;  margin-bottom:15px;}
.wp_txt h4 {width: 100%; font-size: 1.6rem; font-weight:400; color:#22385d; line-height:1.5; border-bottom:none; margin-bottom:10px;}
.wp_txt h5 {width: 100%; font-size: 1.4rem; font-weight:400; color:#22385d; line-height:1.5; margin-bottom:10px;}
.wp_txt h6 {width: 100%; font-size: 1.2rem; font-weight:400; color:#22385d; line-height:1.5; }
.wp_txt p {font-size: 1.4rem;  }

.pagination{margin:50px auto 0 auto;}
}




/*========================================
pages
=======================================*/


/* page title */
#page_title {width: 100%; height: 380px; display: flex;justify-content: center;align-items: center; background-image: linear-gradient(135deg, rgba(0, 92, 161, 1), rgba(91, 193, 216, 1));position: relative; overflow: hidden;-webkit-transition: all .3s;transition: all .3s;}
#page_title .page_title_inner {height: 100%;width: 100%; max-width: 1400px; display: flex;justify-content: flex-start;align-items: center; margin: 0 auto;}
#page_title h2 {font-family: "Roboto", sans-serif; font-size: 1.8rem;font-variation-settings: "wdth" 75; font-weight: 500; line-height: 1.5; color: #ffffff;}
#page_title h2 span {display: block; font-size: 4.8rem; font-weight: 600; color: #ffffff;}

.company_bg::before {content:"COMPANY";font-family: "Roboto", sans-serif; font-size: 14rem; font-variation-settings: "wdth" 75;font-weight: 500; line-height: 1; color: #ffffff; position: absolute; bottom:-25px; right: -2px; mix-blend-mode: overlay; opacity: 0.5;}
.privacy_bg::before {content:"Privacy Policy";font-family: "Roboto", sans-serif; font-size: 14rem; font-variation-settings: "wdth" 75;font-weight: 500; line-height: 1; color: #ffffff; position: absolute; bottom:-25px; right: -2px; mix-blend-mode: overlay; opacity: 0.5;}
.news_bg::before {content:"NEWS";font-family: "Roboto", sans-serif; font-size: 14rem; font-variation-settings: "wdth" 75;font-weight: 500; line-height: 1; color: #ffffff; position: absolute; bottom:-25px; right: -2px; mix-blend-mode: overlay; opacity: 0.5;}
.contact_bg::before {content:"CONTACT";font-family: "Roboto", sans-serif; font-size: 14rem; font-variation-settings: "wdth" 75;font-weight: 500; line-height: 1; color: #ffffff; position: absolute; bottom:-25px; right: -2px; mix-blend-mode: overlay; opacity: 0.5;}


#company_wrap_01 {width: 100%;background: #f2f4f8;background-image: url("../img/page_bg_white.svg"); background-size: 680px auto; background-repeat: no-repeat; background-position: bottom -5px left 0; }
#company_wrap_01 .section_inner {width: 100%; max-width: 1400px; margin: 0 auto; padding: 85px 0;}
#company_wrap_01 .section_inner h3 img {width: 90%; max-width: 595px;}
#company_wrap_01  h4 {width: 100%; font-size: 2.4rem; font-weight: 600; line-height: 1; color: #005ca1;text-align: center; margin-bottom: 30px;}
#company_wrap_01  p {width: 100%; font-size: 2rem; font-weight: 500; line-height: 2.2; color: #005ca1;text-align: center;}

#company_wrap_02 {width: 100%;background: #ffffff;background-image: url("../img/page_bg_gray.svg"); background-size: 680px auto; background-repeat: no-repeat; background-position: bottom -5px right 0; }
#company_wrap_02 .section_inner {width: 100%; max-width: 950px; margin: 0 auto; padding: 85px 0;}
#company_wrap_02  p {width: 100%; font-size: 1.6rem; font-weight: 500; line-height: 2; color: #22385d;text-align: left;}
#company_wrap_02  p:last-child {width: 100%; font-size: 1.6rem; font-weight: 500; line-height: 2; color: #22385d;text-align: right; margin-top: 30px;}

#company_wrap_03 {width: 100%;background: #f2f4f8;background-image: url("../img/news_bg.png"); background-size: 490px auto; background-repeat: no-repeat; background-position: top -5px left -10px; }
#company_wrap_03 .section_inner {width: 100%; max-width: 750px; margin: 0 auto; padding: 85px 0;}
.company_profile_wrap {width: 100%; padding:0}
.company_profile_wrap dl {width: 100%;display: flex; justify-content:flex-start; align-items: stretch; flex-direction: row; }
.company_profile_wrap dl dt {width: 180px;font-size: 1.6rem; font-weight: 500; line-height: 2; padding: 20px 0; text-align: left;}
.company_profile_wrap dl dd {width: 100%;font-size: 1.6rem; font-weight: 500; line-height: 2; text-align: left; border-left: 1px solid rgba(34,56,93,0.2);padding: 20px 0 20px 40px; }

#company_wrap_04 {width: 100%;background: #ffffff; }
#company_wrap_04 .section_inner {width: 100%; max-width: 650px; margin: 0 auto; padding: 85px 0;}
#company_wrap_04 ul {display: grid; grid-template-columns: 110px 1fr; gap:40px;}
#company_wrap_04 ul li:first-child{width: auto; font-family: "Roboto", sans-serif; font-size: 2rem; font-variation-settings: "wdth" 75;font-weight: 500; line-height: 1; text-align: left; border-right: 1px solid rgba(34,56,93,0.2); vertical-align: top; position: relative;padding: 20px 40px 20px 0;}
#company_wrap_04 ul li:last-child {width: 100%; font-size: 1.6rem; font-weight: 400; line-height: 1.8;position: relative; vertical-align: top; display: flex; flex-direction: row; justify-content: flex-start; align-items:stretch; padding: 15px 0 20px 0;}
#company_wrap_04 ul li:first-child::after {content: ""; display: block; width: 10px; height: 10px; font-size: 1px; background: #22385d; position: absolute; top:25px; right:-5px; border-radius: 100%; }

#company_wrap_05 {width: 100%;background: #f2f4f8;background-image: url("../img/page_bg_white.svg"); background-size: 680px auto; background-repeat: no-repeat; background-position: bottom -5px left 0; }
#company_wrap_05 .section_inner {width: 100%; max-width: 900px; margin: 0 auto; padding: 85px 0;}
#company_wrap_05  h4 {width: 100%; font-size: 2.8rem; font-weight: 500; line-height: 1; color: #22385d;text-align: left; margin-bottom: 30px;}
#company_wrap_05  p {width: 100%; font-size: 1.6rem; font-weight: 500; line-height: 2; color: #22385d;text-align: left;}
#company_wrap_05  .img_wrap {width: 100%; max-width: 350px; margin:50px auto 0 auto;}
#company_wrap_05  .img_wrap img {width: 100%; max-width: 350px; }

#company_wrap_06 {width: 100%;background: #ffffff; }
#company_wrap_06 .section_inner {width: 100%; max-width: 900px; display: flex;justify-content: flex-start;align-items: flex-start;flex-direction: column;gap:60px; margin: 0 auto; padding: 85px 0;}
#company_wrap_06  h5 {width: 100%; font-size: 2.2rem; font-weight: 500; line-height: 1; color: #22385d;text-align: left; margin-bottom: 30px;}
#company_wrap_06  article {width: 100%;}
#company_wrap_06  p {width: 100%; font-size: 1.6rem; font-weight: 500; line-height: 2; color: #22385d;text-align: left;}

#company_wrap_07 {width: 100%;background: #f2f4f8;background-image: url("../img/page_bg_white.svg"); background-size: 680px auto; background-repeat: no-repeat; background-position: bottom -5px left 0; }
#company_wrap_07 .section_inner {width: 100%; max-width: 900px; margin: 0 auto; padding: 50px 0;}
#company_wrap_07  h4 {width: 100%; font-size: 2.8rem; font-weight: 500; line-height: 1; color: #22385d;text-align: left; }
#company_wrap_07  p {width: 100%; font-family: "Roboto", sans-serif; font-size: 1.8rem; font-variation-settings: "wdth" 75;font-weight: 500; line-height: 1; color: #22385d;text-align: left;margin-bottom: 30px;}

#company_wrap_08 {width: 100%;background: #ffffff; min-height: 600px;}
#company_wrap_08 .section_inner {width: 100%; max-width: 900px; margin: 0 auto; padding: 50px 0 80px 0;}
#company_wrap_08  {width: 100%; font-size: 1.6rem; font-weight: 500; line-height: 2; color: #22385d;text-align: left;}


#company_wrap_09 .news_wrap {width: 100%; min-height: 600px;}
#company_wrap_09 .section_inner {width: 100%; max-width: 900px; margin: 0 auto; padding: 80px 0 80px 0;}
#company_wrap_09 .news_wrap dl {width:100%; height: auto;border-bottom: 1px solid #909bae;padding: 35px 0; position: relative;display: grid; grid-template-columns: 95px auto; gap:20px; padding-right: 40px;color: #22385d;-webkit-transition: all .3s;transition: all .3s}
#company_wrap_09 .news_wrap dl:first-of-type  {border-top: 1px solid #909bae;}
#company_wrap_09 .news_wrap dl::after {content: "\e901";font-size: 1.2rem; font-family: 'icomoon' !important; speak: never;font-style: normal;font-weight: normal;font-variant: normal;text-transform: none;line-height: 1; position: absolute; top:50%; transform: translate(-50%, 0); right: 10px;-webkit-transition: all .3s;transition: all .3s} 
#company_wrap_09 .news_wrap dl dt {width:auto; height: auto; font-family: "Roboto", sans-serif;font-size: 1.6rem; font-weight: 500; line-height: 1.5; white-space: nowrap;display: flex;justify-content: flex-start;align-items: center; flex-direction: row;-webkit-transition: all .3s;transition: all .3s}
#company_wrap_09 .news_wrap dl dd {width:100%; height: auto; font-size: 1.6rem; font-weight: 500; line-height: 1.5; display: flex;justify-content: space-between;align-items: center; flex-direction: row;-webkit-transition: all .3s;transition: all .3s}
@media screen and (min-width: 768px) {
#company_wrap_09 .news_wrap dl:hover {color: #00afcc;}
#company_wrap_09 .news_wrap dl:hover::after {right: 0; }
}

#company_wrap_10 {width: 100%;background: #ffffff;}
#company_wrap_10 .section_inner {width: 100%; max-width: 860px; margin: 0 auto; padding: 85px 0 85px 0;}
#company_wrap_10  h4 {width: 100%; font-size: 2.8rem; font-weight: 500; line-height: 1; color: #22385d;text-align: left; margin-bottom: 30px;}
#company_wrap_10  p {width: 100%; font-size: 1.6rem; font-weight: 500; line-height: 2; color: #22385d;text-align: left;margin-bottom: 50px;}
#company_wrap_10  .contact_form p {line-height: 1.5; margin-bottom: 0;}


.section_inner h3 {width: 100%; font-size: 2.4rem; font-weight: 600; line-height: 1.8; color: #005ca1;display: flex;justify-content: center;align-items: center;flex-direction: column; text-align: center; margin-bottom: 55px;}
.section_inner h3 span {display: block; font-family: "Roboto", sans-serif; font-size: 9rem; font-variation-settings: "wdth" 75;font-weight: 500; line-height: 1; background-image: linear-gradient(135deg, rgba(0, 92, 161, 1), rgba(91, 193, 216, 1));margin-left: -5px;-webkit-background-clip:text;-webkit-text-fill-color: transparent;}

@media screen and (max-width: 1450px) {
/* page title */
#page_title .page_title_inner {padding: 0 25px;}
.section_inner {padding-right: 20px!important; padding-left: 20px!important;}
}


@media screen and (max-width: 768px) {
/* page title */
#page_title {width: 100%; height: 280px; }
#page_title .page_title_inner {height: 100%;width: 100%; max-width: 1400px; display: flex;justify-content: flex-start;align-items: center; margin: 0 auto; padding: 0 20px;}
#page_title h2 {font-family: "Roboto", sans-serif; font-size: 1.6rem;font-variation-settings: "wdth" 75; font-weight: 500; line-height: 1.5; color: #ffffff;}
#page_title h2 span {display: block; font-size: 3rem; font-weight: 600; color: #ffffff;}

.company_bg::before {content:"COMPANY";font-family: "Roboto", sans-serif; font-size: 8rem; font-variation-settings: "wdth" 75;font-weight: 500; line-height: 1; color: #ffffff; position: absolute; bottom:-12px; right: -2px; mix-blend-mode: overlay; opacity: 0.5;}
.privacy_bg::before {content:"Privacy Policy";font-family: "Roboto", sans-serif; font-size: 6rem; font-variation-settings: "wdth" 75;font-weight: 500; line-height: 1; color: #ffffff; position: absolute; bottom:-12px; right: -2px; mix-blend-mode: overlay; opacity: 0.5;}
.news_bg::before {content:"NEWS";font-family: "Roboto", sans-serif; font-size: 8rem; font-variation-settings: "wdth" 75;font-weight: 500; line-height: 1; color: #ffffff; position: absolute; bottom:-12px; right: -2px; mix-blend-mode: overlay; opacity: 0.5;}
.contact_bg::before {content:"CONTACT";font-family: "Roboto", sans-serif; font-size: 8rem; font-variation-settings: "wdth" 75;font-weight: 500; line-height: 1; color: #ffffff; position: absolute; bottom:-12px; right: -2px; mix-blend-mode: overlay; opacity: 0.5;}

#company_wrap_01 {width: 100%;background: #f2f4f8;background-image: url("../img/page_bg_white.svg"); background-size: 280px auto; background-repeat: no-repeat; background-position: bottom -2px left 0; }
#company_wrap_01 .section_inner {width: 100%; max-width: 1400px; margin: 0 auto; padding: 50px 0;}
#company_wrap_01 .section_inner h3 img {width: 100%; max-width: 595px;}
#company_wrap_01  h4 {width: 100%; font-size: 2rem; font-weight: 600; line-height: 1; color: #005ca1;text-align: center; margin-bottom: 20px;}
#company_wrap_01  p {width: 100%; font-size: 1.6rem; font-weight: 500; line-height: 2.2; color: #005ca1;text-align: center;}

#company_wrap_02 {width: 100%;background: #ffffff;background-image: url("../img/page_bg_gray.svg"); background-size: 280px auto; background-repeat: no-repeat; background-position: bottom -2px right 0; }
#company_wrap_02 .section_inner {width: 100%; max-width: 900px; margin: 0 auto; padding: 50px 0;}
#company_wrap_02  p {width: 100%; font-size: 1.4rem; font-weight: 500; line-height: 2; color: #22385d;text-align: left;}
#company_wrap_02  p:last-child {width: 100%; font-size: 1.4rem; font-weight: 500; line-height: 2; color: #22385d;text-align: right; margin-top: 30px;}

#company_wrap_03 {width: 100%;background: #f2f4f8;background-image: url("../img/news_bg.png"); background-size: 350px auto; background-repeat: no-repeat; background-position: top -5px left -10px; }
#company_wrap_03 .section_inner {width: 100%; max-width: 700px; margin: 0 auto; padding: 50px 0;}
.company_profile_wrap dl {width: 100%;display: flex; justify-content:flex-start; align-items: stretch; flex-direction: column; border-bottom: 1px solid rgba(34,56,93,0.2);}
.company_profile_wrap dl dt {width: 100%;font-size: 1.4rem; font-weight: 600; line-height: 2; padding: 20px 0 0 0; text-align: left;}
.company_profile_wrap dl dd {width: 100%;font-size: 1.4rem; font-weight: 500; line-height: 2; text-align: left; border-left: none;padding: 0 0 20px 0; }

#company_wrap_04 {width: 100%;background: #ffffff; }
#company_wrap_04 .section_inner {width: 100%; max-width: 650px; margin: 0 auto; padding: 50px 0;}
#company_wrap_04 ul {width: 100%; display: grid; grid-template-columns: 90px 1fr; gap:25px;}
#company_wrap_04 ul li:first-child{width: auto; font-family: "Roboto", sans-serif; font-size: 1.8rem; font-variation-settings: "wdth" 75;font-weight: 500; line-height: 1; text-align: left; border-right: 1px solid rgba(34,56,93,0.2); vertical-align: top; position: relative;padding: 15px 25px 15px 0;}
#company_wrap_04 ul li:last-child {width: 100%; font-size: 1.4rem; font-weight: 400; line-height: 1.8;position: relative; vertical-align: top; display: flex; flex-direction: row; justify-content: flex-start; align-items:stretch; padding: 9px 0 15px 0;}
#company_wrap_04 ul li:first-child::after {content: ""; display: block; width: 10px; height: 10px; font-size: 1px; background: #22385d; position: absolute; top:18px; right:-5px; border-radius: 100%; }

#company_wrap_05 {width: 100%;background: #f2f4f8;background-image: url("../img/page_bg_white.svg"); background-size: 680px auto; background-repeat: no-repeat; background-position: bottom -5px left 0; }
#company_wrap_05 .section_inner {width: 100%; max-width: 900px; margin: 0 auto; padding: 85px 0;}
#company_wrap_05  h4 {width: 100%; font-size: 2.2rem; font-weight: 500; line-height: 1; color: #22385d;text-align: left; margin-bottom: 30px;}
#company_wrap_05  p {width: 100%; font-size: 1.4rem; font-weight: 500; line-height: 2; color: #22385d;text-align: left;}
#company_wrap_05  .img_wrap {width: 100%; max-width: 250px; margin:40px auto 0 auto;}
#company_wrap_05  .img_wrap img {width: 100%; max-width: 250px; }

#company_wrap_06 {width: 100%;background: #ffffff; }
#company_wrap_06 .section_inner {width: 100%; max-width: 900px; display: flex;justify-content: flex-start;align-items: flex-start;flex-direction: column;gap:40px; margin: 0 auto; padding: 50px 0;}
#company_wrap_06  h5 {width: 100%; font-size: 1.8rem; font-weight: 500; line-height: 1; color: #22385d;text-align: left; margin-bottom: 20px;}
#company_wrap_06  article {width: 100%;}
#company_wrap_06  p {width: 100%; font-size: 1.4rem; font-weight: 500; line-height: 2; color: #22385d;text-align: left;}

#company_wrap_07 {width: 100%;background: #f2f4f8;background-image: url("../img/page_bg_white.svg"); background-size: 280px auto; background-repeat: no-repeat; background-position: bottom -2px left 0; }
#company_wrap_07 .section_inner {width: 100%; max-width: 900px; margin: 0 auto; padding: 50px 0;}
#company_wrap_07  h4 {width: 100%; font-size: 2.2rem; font-weight: 500; line-height: 1; color: #22385d;text-align: left; }
#company_wrap_07  p {width: 100%; font-family: "Roboto", sans-serif; font-size: 1.4rem; font-variation-settings: "wdth" 75;font-weight: 500; line-height: 1; color: #22385d;text-align: left;margin-bottom: 20px;}

#company_wrap_08 {width: 100%;background: #ffffff; min-height: 400px;}
#company_wrap_08 .section_inner {width: 100%; max-width: 900px; margin: 0 auto; padding: 30px 0 50px 0;}
#company_wrap_08  {width: 100%; font-size: 1.4rem; font-weight: 500; line-height: 2; color: #22385d;text-align: left;}

#company_wrap_09 .news_wrap {width: 100%; min-height: 400px;}
#company_wrap_09 .section_inner {width: 100%; max-width: 900px; margin: 0 auto; padding: 50px 0 50px 0;}
#company_wrap_09 .news_wrap dl {width:100%; height: auto;border-bottom: 1px solid #909bae;padding: 25px 0; position: relative;display: flex;justify-content: flex-start;align-items: flex-start;flex-direction: column;gap:10px; padding-right: 30px;color: #22385d;-webkit-transition: all .3s;transition: all .3s}
#company_wrap_09 .news_wrap dl:first-of-type  {border-top: 1px solid #909bae;}
#company_wrap_09 .news_wrap dl::after {content: "\e901";font-size: 1.2rem; font-family: 'icomoon' !important; speak: never;font-style: normal;font-weight: normal;font-variant: normal;text-transform: none;line-height: 1; position: absolute; top:50%; transform: translate(-50%, 0); right: 0;-webkit-transition: all .3s;transition: all .3s} 
#company_wrap_09 .news_wrap dl dt {width:auto; height: auto; font-family: "Roboto", sans-serif;font-size: 1.6rem; font-weight: 500; line-height: 1.5; white-space: nowrap;display: flex;justify-content: flex-start;align-items: center; flex-direction: row;-webkit-transition: all .3s;transition: all .3s}
#company_wrap_09 .news_wrap dl dd {width:100%; height: auto; font-size: 1.6rem; font-weight: 500; line-height: 1.5; display: flex;justify-content: space-between;align-items: center; flex-direction: row;-webkit-transition: all .3s;transition: all .3s}

#company_wrap_10 {width: 100%;background: #ffffff;}
#company_wrap_10 .section_inner {width: 100%; max-width: 860px; margin: 0 auto; padding:50px 0;}
#company_wrap_10  h4 {width: 100%; font-size: 2.2rem; font-weight: 500; line-height: 1; color: #22385d;text-align: left; margin-bottom: 20px;}
#company_wrap_10  p {width: 100%; font-size: 1.4rem; text-align: left;margin-bottom: 20px;}
#company_wrap_10  .contact_form p {margin-bottom: 0;}

.section_inner h3 {width: 100%; font-size: 1.8rem; font-weight: 600; line-height: 1.8; color: #005ca1;display: flex;justify-content: center;align-items: center;flex-direction: column; text-align: center; margin-bottom: 30px;}
.section_inner h3 span {display: block; font-family: "Roboto", sans-serif; font-size: 6rem;}


}







/*========================================
header
=======================================*/


header {}
#navi {width: 100%;height: 80px;position: fixed;top: 0;left: 0;z-index: 100;background-image: linear-gradient(90deg, rgba(255, 255, 255, 1) 5%, rgba(255, 255, 255, 0) 25%);-webkit-transition: all .3s;transition: all .3s;}
body.page #navi {background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 5%, rgba(255, 255, 255, 0) 25%);}
body.page #navi.is-scrolled {background-image: linear-gradient(90deg, rgba(255, 255, 255, 1) 5%, rgba(255, 255, 255, 0) 25%);-webkit-transition: all .3s;transition: all .3s;}
/* チェックボックスを非表示 */
#navi input {display: none;}

#navi h1 {width: 300px; position: absolute; top:17px; left: 20px; -webkit-transition: all .3s;transition: all .3s;}
#navi h1 img {width: 100%; vertical-align: middle;-webkit-transition: all .3s;transition: all .3s;}

.menu { display: flex; justify-content: flex-end;align-items: center; gap:10px;-webkit-transition: all .3s;transition: all .3s;}
.menu > div{ height: 90px; display: flex; justify-content: flex-end;align-items: center; flex-direction: row; gap:30px;padding: 0 20px 0 0;}
.menu > div > div {display: flex; justify-content: flex-end;align-items: center; flex-direction: row; }
.menu > div > div a{height: 42px; width: 175px; font-size: 1.6rem; font-weight: 500; line-height: 1; color: #ffffff;display: flex; justify-content:space-between;align-items: center; flex-direction: row;  background: #113866; border-radius: 5px 21px 21px 5px ; padding: 0 15px 0 20px;-webkit-transition: all .3s;transition: all .3s;}
.menu > div > div a::after {content:"\e901"; font-family: 'icomoon' !important; font-size: 0.8em; -webkit-transition: all .3s;transition: all .3s;}

@media screen and (min-width: 768px) {
.menu > div > div a:hover{color: #ffffff; background: #00afcc;padding: 0 10px 0 20px;}
}

.menu ul{display: flex;justify-content: center;align-items: flex-end; gap:30px;}
.menu-parent {font-size: 1.6rem;font-weight: 600;line-height: 1;white-space: nowrap;}


/* パソコンでは V を非表示 */
.menu-parent .pd {display: none;}
/* 上部メニューの最後の項目 */
.menu-parent:last-child {
  margin-right: 0px;
}

#menu-navibtn {display: none;cursor: pointer;cursor: hand;}



@media screen and (max-width: 768px) {

#navi {position: fixed;top: 0;left: 0;height: auto; min-height: 60px;width: 100%;padding: 0;background-image: linear-gradient(90deg, rgba(255, 255, 255, 1) 10%, rgba(255, 255, 255, 0)70%);}
body.page #navi {background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 0)70%);-webkit-transition: all .3s;transition: all .3s;}
body.page #navi.is-scrolled {background-image: linear-gradient(90deg, rgba(255, 255, 255, 1) 10%, rgba(255, 255, 255, 0)70%);-webkit-transition: all .3s;transition: all .3s;}

/* チェックボックスを非表示 */
#navi input {display: none;}


/* 左上ロゴ */
#navi h1 {width: 200px; height: auto; }
#navi h1 img {width: 100%; }



  /* スマホの際に V を表示 */
.menu-parent .pd {display: inline-block;width: 100%;}

.menu-parent .pd::after {content: "+";display: inline-block;color: #113866;font-size: 1.6rem;width: 100%;}
.menu {display: flex;justify-content: center;align-items: flex-start;width: 100%;height: 0; opacity: 0;padding: 0;visibility: hidden;}

  
.menu-parent {width: 100%;padding: 20px 20px;text-align: left;height:auto;border-bottom: 1px solid #909bae;}
.menu-parent:first-of-type {border-top: 1px solid #909bae;}
  
.menu-parent > a {padding: 20px 0; color: #113866;}


  /* メニューを移動させないため */
  #menu-navibtn:checked ~ #navi {position: fixed;overflow-y: scroll;overflow-x: hidden;height: 100%;background-image: linear-gradient(135deg, rgba(255, 255, 255, 1), rgba(199, 216, 231, 1)); }
}



/* ドロップダウンメニュー */
.menu-parent {}
.menu-parent .menu-child {display: flex; justify-content: flex-start;align-items: flex-start; flex-direction: column;visibility: hidden;opacity: 0;position: absolute;}
.menu-parent .menu-child li a {width: 100%; height: 100%;}



/* PC */
@media screen and (min-width : 768px ){
.menu-parent:hover .menu-child {visibility: visible;opacity: 1;padding: 30px;position: absolute;display: flex; justify-content: center;align-items: flex-start; flex-direction: row; flex-wrap: wrap; gap:20px;background: #ffffff;right: -5px;width:675px;}

.menu-parent .menu-child li {overflow: hidden;height: 0;text-align: left!important;-webkit-transition: all .3s;transition: all .3s;line-height: 1;width: 45%;font-size: 1.4rem;}
  
.menu-parent .menu-child li a {width: 100%; height: 100%;display: flex; justify-content: space-between;align-items: center; position: relative; border: 1px solid #b8c3d1; color: #113866; padding: 0 15px; border-radius: 20px;-webkit-transition: all .3s;transition: all .3s;}
.menu-parent .menu-child li a::after {content:"\e90f";font-family: "icomoon"; font-size: 1.6rem; position: absolute; right:15px;-webkit-transition: all .3s;transition: all .3s;}

.menu-parent .menu-child li.sub_menu {font-size: 1.2rem;padding:  0 15px 0 35px;}
.menu-parent:hover .menu-child li {overflow: visible;height: 40px;}
.menu-parent .menu-child li:hover a{color: #ffffff;background: #fe6b02;border: 1px solid #fe6b02; }
.menu-parent .menu-child li:hover a::after {right:10px;}
.menu-parent > a {position: relative;display: block;text-decoration: none;padding: 0;overflow: hidden;color: transparent;text-shadow: 0 -1.5em 0 #113866, 0 0 0 #113866;transition: text-shadow 0.4s cubic-bezier(0.76, 0, 0.24, 1);}
body.page .menu-parent > a {position: relative;display: block;text-decoration: none;padding: 0;overflow: hidden;color: transparent;text-shadow: 0 -1.5em 0 #ffffff, 0 0 0 #ffffff;transition: text-shadow 0.4s cubic-bezier(0.76, 0, 0.24, 1);}
body.page nav.is-scrolled  .menu-parent > a {position: relative;display: block;text-decoration: none;padding: 0;overflow: hidden;color: transparent;text-shadow: 0 -1.5em 0 #113866, 0 0 0 #113866;transition: text-shadow 0.4s cubic-bezier(0.76, 0, 0.24, 1);}


.menu-parent > a:hover {text-shadow: 0 0 0 #113866, 0 1.5em 0 #113866;}
body.page .menu-parent > a:hover {text-shadow: 0 0 0 #ffffff, 0 1.5em 0 #ffffff;}
body.page nav.is-scrolled .menu-parent > a:hover {text-shadow: 0 0 0 #113866, 0 1.5em 0 #113866;}
.menu article { display: none;}
}



/* スマホ用 */
@media screen and (max-width: 768px) {

.menu {flex-direction: column; width: 100%; padding: 0 10px; -webkit-transition: all .0s;transition: all .0s;}
.menu ul{flex-direction: column; width: 100%; gap:0;}
.menu > div  {gap:50px; }
.menu > div > div {width: 100%; display: flex; justify-content: center;align-items: center; flex-direction: row; gap:10px; }
.menu > div > div a{width: 100%; height: 42px; font-size: 1.6rem; font-weight: 600; background: #113866;}
.menu > div { order: 1;flex-direction: column; width: 100%; justify-content: flex-start;margin-bottom: 20px; padding: 0;}
.menu > div a { width: 100%; height: 60px;}

.menu article {width: 100%; display: flex;justify-content: center;align-items: center; flex-direction: row; gap:30px; margin-top: 20px; padding-bottom: 30px;}
.menu article a {width: auto; height: auto;font-size: 3rem; color: #113866;}
  
  /* ハンバーガーメニューがクリックされた時 */
  #menu-navibtn:checked ~ * .menu {opacity: 1;height: auto;visibility: visible;flex-direction: column; padding: 100px 10px 0 10px; -webkit-transition: all .3s;transition: all .3s;}
  #menu-navibtn:checked ~ * .menu-parent {max-height: inherit;overflow-y: visible;}
  #menu-navibtn:checked ~ * .menu-child {max-height: 0;overflow-y: hidden;visibility: hidden;}
  
  /* 子メニュー */
  .menu-parent .menu-child {flex-direction: column;position: relative;padding: 0 ;opacity: 1;top: 0; margin-left: auto;left: auto;width: auto;}

  .menu-parent .menu-child li {width: 100%;height: 0;border-top: 1px dotted #909bae;-webkit-transition: all .3s;transition: all .3s;}
  .menu-parent > label:hover {cursor: pointer;cursor: hand;}
  
  #navi input[type="checkbox"]:checked ~ label .pd::after {content: "-";}
  
  /* 子メニューがクリックされた時 */
  #navi input[type="checkbox"]:checked ~ .menu-child {max-height: inherit;overflow-y: visible;visibility: visible;margin-top: 20px;}
    /* 子メニューがクリックされた時 */
  #navi input[type="checkbox"]:checked ~ .menu-child li { height: 40px;-webkit-transition: all .3s;transition: all .3s;}
  #navi input[type="checkbox"]:checked ~ .menu-child li a {width: 100%; height: 100%;display: flex; align-items: center; color: #113866;}

}

/* 子メニュー */
.menu-child li {font-size: 1.4rem;min-width: 180px;}
.menu-child li.sub_menu {font-size: 1.2rem; padding-left: 20px;}
/* ハンバーガー */
#navi #navibtn {display: none;}



@media screen and (max-width: 768px) {
  #navi #navibtn {display: block;position: absolute;top: 10px;right: 10px; cursor: pointer;}
  #navibtn span {display: block;width: 40px;height: 40px;background-color: #113866;-webkit-transition: .35s ease-in-out;-moz-transition: .35s ease-in-out;transition: .35s ease-in-out;}
  #navibtn span span {display: block;overflow: hidden;width: 1px;height: 1px;}
  #navibtn span span::before,
  #navibtn span span::after,
  #navibtn span::after {position: absolute;left:10px;content:"";width: 20px;height: 1px;background-color: #FFF;-webkit-transition: .3s ease-in-out;-moz-transition: .3s ease-in-out;transition: .3s ease-in-out;}
  /* 上の棒 */
  #navibtn span span::before {top:12px;}
  #menu-navibtn:checked ~ #navi label#navibtn span span::before {top:19px;-webkit-transform: rotate(315deg);-moz-transform: rotate(315deg);transform: rotate(315deg);}
  /* 下の棒 */
  #navibtn span::after {top:26px;}
  #menu-navibtn:checked ~ #navi label#navibtn > span::after {top:19px;-webkit-transform: rotate(-315deg);-moz-transform: rotate(-315deg);transform: rotate(-315deg);}
  /* 中の棒 */
  #navibtn span span::after {top:19px;}
  #menu-navibtn:checked ~ #navi label#navibtn span span::after {display: none;}
}








/*========================================
contact
=======================================*/

.contact_tel_wrap {width:100%; text-align: center; padding-top: 20px; }
.contact_tel_wrap div{width:auto; font-family: "Jost", sans-serif;font-size: 4.8rem; font-weight: 400; line-height: 1.2; display: flex;justify-content: center;align-items: center; gap:15px;}
.contact_tel_wrap div i{font-size: 1.2em}


.contact_wrap {width: 100%; max-width:860px;  padding: 0 0 0 0; margin: 0 auto; position: relative;}
.contact_wrap p {font-size: 1.6rem;line-height: 1.7; font-weight:400;  }
.contact_form {width: 100%;border-collapse: collapse;margin: 0 auto;}
.contact_wrap tr {display: block;border-top:1px solid #b8c3d1;}
.contact_wrap tr.bnone {border: none; }
.contact_wrap tr:last-child {border-bottom: solid 1px rgba(34,56,93,0.2);}
.contact_wrap th {font-size: 1.7rem; font-weight: 500;width: 220px;padding: 40px 0 0 0;text-align: left;vertical-align: top;}
main.confirm .contact_wrap th {font-size: 1.7rem; font-weight: 500;width: 220px;padding: 0 0 0 0;text-align: left;vertical-align: middle;}
.contact_wrap th > div{width: 100%; display: flex;justify-content: space-between;align-items: center;  vertical-align: text-top; position: relative;}
.contact_wrap th > div div {display: flex; justify-content:flex-start; flex-wrap: wrap; flex-direction: column; line-height: 1.5}
.contact_wrap th.required > div:after {content: "必須";background: #fe6b02;color: #ffffff;font-size: 1.4rem;padding: 8px;text-align: center; white-space: nowrap; border-radius: 3px;}
.contact_wrap td {width: 660px; font-size: 1.6rem; font-weight: 500;padding: 30px 0 30px 50px;text-align: left;}
.contact_wrap tr.bnone th{padding: 15px 0 30px 0;}
.contact_wrap tr.bnone td{padding: 0 0 30px 50px;}
.wpcf7-email,.wpcf7-text,.contact_wrap input[type="text"]{ display: block;width: 100%; height: 60px; border: none; background: #e9ebef;padding: 0 20px; border-radius: 3px;vertical-align: top;outline: none;font-size: 1.6rem; }
.contact_wrap input[type="text"]:nth-of-type(2){margin-top: 10px;}
.contact_wrap select{ display: block;width: 100%; height: 60px; border: none; background: #e9ebef;padding: 0 20px; border-radius: 3px;vertical-align: top;outline: none;font-size: 1.6rem; -webkit-appearance: none;appearance: none;}
.select_wrapper {position: relative;}
.select_wrapper::after {content: "";position: absolute;top: 21px;right: 16px;width: 12px;height: 12px;border-right: 2px solid #333;border-bottom: 2px solid #333;transform: rotate(45deg);pointer-events: none;}

.contact_wrap .pcode {display: flex; justify-content: flex-start; align-items: center; flex-wrap: nowrap; margin-bottom: 20px;}
.contact_wrap .pcode p {display: flex; justify-content: flex-start; align-items: center; flex-wrap: nowrap;}
.contact_wrap .pcode input {width: 160px;}
.contact_wrap textarea {display: block;width: 100%; height: auto; border: none; background: #e9ebef;padding: 20px; border-radius: 3px;vertical-align: top;outline: none;font-size: 1.6rem;  }
.wpcf7-email:focus,.wpcf7-text:focus,.contact_wrap input[type="text"]:focus,.contact_form textarea:focus {border: solid 1px rgba(0,92,161,.5);}
.contact_wrap input[type="checkbox"],.contact_wrap input[type="radio"] {width: 18px;height: 18px;margin: 0;padding: 0;}
.contact_wrap .text-area {display: flex; justify-content: flex-start; align-items: center; gap:20px; padding-top: 10px; font-size: 1.6rem;}

.top-cell {padding: 30px 0 0 0!important;}


::placeholder {color: #aaaaaa;}
::-ms-input-placeholder {color: #aaaaaa;}
:-ms-input-placeholder {color: #aaaaaa;}

.contact_wrap .checkbox_label {display: inline-block;cursor: pointer;font-size: 1.6rem; }
.contact_wrap .checkbox_txt {vertical-align: top;}
.wpcf7-response-output,.contact_wrap label.error {font-size: 1.6rem;display: block;margin: .3em 0 0 0;color: #dd0030; border:none!important;}
.wpcf7-response-output{text-align:center;}
.confirm_wrap {text-align: center; margin-top: 50px;}
.confirm_wrap02 {text-align: center; display: flex; justify-content: space-around;align-items: center;}
.confirm_wrap label{margin-bottom: 0;}
.confirm_wrap p {text-align: center!important; }
.confirm_wrap p:nth-child(2) {margin-bottom:20px;}



.confirm_btn {width: 300px; height: 46px;font-size: 1.6rem; font-weight: 400; display:flex; justify-content: space-between;align-items: center; position: relative; background: #113866; color: #ffffff; padding: 0 20px; border-radius: 23px;cursor: pointer; margin: 0 auto; -webkit-transition: all .3s;transition: all .3s;}
.confirm_btn::after {content:"\e901";font-family: "icomoon"; font-size: 0.8em; position: absolute; color: #ffffff;  right:15px;-webkit-transition: all .3s;transition: all .3s;}

.back_btn {width: 300px; height: 46px;font-size: 1.6rem; font-weight: 400; display:inline-flex; justify-content: center;align-items: center; position: relative; border: 1px solid #b8c3d1; color: #113866; padding: 0 ; border-radius: 23px;-webkit-transition: all .3s;transition: all .3s; margin:0 auto 20px auto;}


@media screen and (min-width: 768px) {
.confirm_btn:hover {background: #fe6b02;}
.confirm_btn:hover::after {right:10px; }
.back_btn:hover {background: #fe6b02; color: #ffffff;border: 1px solid #fe6b02;}
}

.confirm th {padding: 30px 0!important; line-height: 1.6;}
.confirm td {padding: 30px 0!important; line-height: 1.6;}

@media screen and (max-width: 768px) {
.contact_tel_wrap {width:100%; text-align: center; padding-top: 20px; }
.contact_tel_wrap div{width:auto; font-family: "Jost", sans-serif;font-size: 4rem; font-weight: 400; line-height: 1.2; display: flex;justify-content: center;align-items: center; gap:15px; margin-left: -15px;}
.contact_tel_wrap div i{font-size: 1.2em}


.contact_wrap p {font-size: 1.4rem;line-height: 1.7; font-weight:500;  }
.contact_form tr,
.contact_form td,
.contact_form tr.bnone td{display: block;width: 100%;padding: 20px 0 10px 0!important;;border: none;font-size: 1.4rem; vertical-align: middle;}
.contact_form th,.contact_form tr.bnone th {width: 100%;padding:0; color: #113866;font-size: 1.6rem;height:50px;display: flex;align-items: center;border-bottom:1px solid #b8c3d1;}
.contact_wrap th.required div:after {font-size: 1.2rem;}
.wpcf7-email,.wpcf7-text,.contact_wrap input[type="text"] {font-size: 1.3rem; height: 50px;}
.wpcf7-response-output,.contact_wrap label.error {font-size: 1.2rem;display: block;margin: .3em 0 0 0;color: #ff6b6b;}
.contact_wrap textarea {font-size: 1.3rem;}
.contact_wrap .checkbox_label {font-size: 1.4rem; }
.contact_wrap input[type="checkbox"],.contact_wrap input[type="radio"] {width: 14px;height: 14px;margin: 0;padding: 0; font-size: 1.4rem;}
.contact_wrap select{ display: block;width: 100%; height: 50px; border: none;padding: 0 20px; border-radius: 3px;vertical-align: top;outline: none;font-size: 1.4rem; -webkit-appearance: none;appearance: none;}
.select_wrapper::after {content: "";position: absolute;top: 18px;right: 16px;width: 12px;height: 12px;border-right: 2px solid #333;border-bottom: 2px solid #333;transform: rotate(45deg);}
.contact_wrap th > div div {display: flex; justify-content:flex-start;align-items: center; flex-direction: row; line-height: 1.5}
.contact_wrap th > div div span {font-size: 1.2rem!important;}

.contact01_wrap,.contact_wrap {padding: 0 0 0 0;}
.confirm_btn {margin: 5vw auto 0;border-radius: 25px;color: #ffffff;font-size: 1.6rem;height: 50px;}
.back_btn {height: 50px;font-size: 1.6rem; }
.contact_wrap p {font-size: 1.4rem;line-height: 1.7; font-weight:400; }
.contact_wrap textarea {border-radius: 5px;}

.top-cell {padding: 0 0 0 0!important;}
.contact_form tr, .contact_form tr.bnone {padding-top: 0!important;}
}








/*========================================
index
=======================================*/


/* MV */
#mv.main-top {height: 750px;width: 100%;background-image: linear-gradient(135deg, rgba(255, 255, 255, 1) 10%, rgba(199, 216, 231, 1) 100%); overflow:hidden;}
#mv.main-top .mv_inner {position: relative;height: 100%;width: 100%; max-width: 1650px; margin: 0 auto;}
.mv_txt {width: 165px; height: auto;position: absolute; top: 80px;left: 50%;transform: translate(-50%, 0); -webkit-transition: all .3s;transition: all .3s}
.mv_txt img {width: 100%;}

.mv_img {width: 580px; height: auto;position: absolute; bottom: 0;right: -6%;-webkit-transition: all .3s;transition: all .3s}
.mv_img img {width: 100%;}

.mv_logo {width: 273px; height: auto;position: absolute; bottom: 204px;left: 12.36%;-webkit-transition: all .3s;transition: all .3s}
.mv_img img {width: 100%;}

.mv_catch {width: 412px; height: auto;position: absolute; bottom: 50px;left: 7.43%;-webkit-transition: all .3s;transition: all .3s}
.mv_catch img {width: 100%;}


/* Concept */
#concept {width: 100%;display: flex;justify-content: center;align-items: center; background-image: linear-gradient(135deg, rgba(0, 92, 161, 1), rgba(91, 193, 216, 1));position: relative;}
#concept .concept_inner {position: relative;height: 100%;width: 100%; max-width: 1400px; margin: 0 auto;z-index: 2; padding: 60px 0 100px;}

@media screen and (max-width: 1450px) {
#concept .concept_inner {padding-left: 25px; padding-right: 25px;}
}


#concept::before {content:""; width: 100%; height: 100%; background-image: url("../img/index_bg.png"); background-size: 1350px auto; background-repeat: no-repeat; background-position: top 0 right -600px; position: absolute; top: 0; left: 0; mix-blend-mode:overlay; z-index: 0;}
#concept .concept_txt {font-size: 2rem; font-weight: 700; line-height: 2; color: #ffff8a; margin-bottom: 120px; text-align: justify;}
#concept h3 {font-size: 1.6rem; font-weight: 500; line-height: 1; color: #ffffff;display: flex;justify-content: flex-start;align-items: flex-start;flex-direction: column; margin-bottom: 60px;}
#concept h3 span {display: block; font-family: "Roboto", sans-serif; font-size: 11rem; font-variation-settings: "wdth" 75;font-weight: 500; line-height: 1; color: #ffffff; margin-left: -5px;}

#concept .card_wrap {width: 100%; display: flex;justify-content: flex-start;align-items: flex-start;flex-direction: row; gap:45px;margin-bottom: 45px;}
#concept .card_wrap .card {width: 50%; background: #f2f4f8; display: flex;justify-content: flex-start;align-items: flex-start;flex-direction: column; gap:25px; padding: 30px; border-radius: 20px; position: relative;box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.1);-webkit-transition: all .3s;transition: all .3s;}
#concept .card_wrap .card .card_tab {width: 260px; height: 30px; font-size: 1.6rem; font-weight: 500; line-height: 1; color: #ffffff;clip-path: polygon(15% 0%, 85% 0%, 100% 100%, 0% 100%); background-color: #005083; display: flex;justify-content: center;align-items: center; position: absolute; top: -30px; left: 50%;transform: translate(-50%, 0); }
#concept .card_wrap .card .card_img {width: 100%; height: 225px; background: #ffffff; border-radius: 10px;display: flex;justify-content: center;align-items: center; }
#concept .card_wrap .card:first-of-type .card_img img{width: 100%; max-width: 234px; -webkit-transition: all .3s;transition: all .3s;}
#concept .card_wrap .card:first-of-type::after {content: "・CAREER INFORMATION FORUM"; width: auto;font-family: "Roboto", sans-serif; font-variation-settings: "wdth" 75;font-size: 1.2rem; font-weight: 500; line-height: 1; letter-spacing: 0.3em; writing-mode: vertical-rl;color: #ffffff;position: absolute; top: 0; right: -18px;}
#concept .card_wrap .card:last-of-type .card_img img{width: 100%; max-width: 258px; -webkit-transition: all .3s;transition: all .3s;}
#concept .card_wrap .card:last-of-type::after {content: "・KOUSOTSU JOBNAVI"; width: auto;font-family: "Roboto", sans-serif; font-variation-settings: "wdth" 75;font-size: 1.2rem; font-weight: 500; line-height: 1; letter-spacing: 0.3em; writing-mode: vertical-rl;color: #ffffff;position: absolute; top: 0; right: -18px;}
#concept .card_wrap .card p {font-size: 1.6rem; font-weight: 500; line-height: 1.75; color: #005ca1; text-align: justify;}
#concept .card_wrap .card .arrow_btn {width: 40px; height: 40px; font-size: 1.2rem; line-height: 1; color: #ffffff; display: flex;justify-content: center;align-items: center; background-image: linear-gradient(135deg, rgba(0, 92, 161, 1), rgba(91, 193, 216, 1)); border-radius: 20px; margin: 0 auto;-webkit-transition: all .3s;transition: all .3s;}

.card_wide {width: 100%; background: #f2f4f8; display: flex;justify-content: space-between;align-items: stretch;flex-direction: row; gap:40px; padding: 30px; border-radius: 20px; position: relative;box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.1);-webkit-transition: all .3s;transition: all .3s;}
.card_wide:last-of-type::after {content: "・IN-SCHOOL CAREER GUIDANCE"; width: auto;font-family: "Roboto", sans-serif; font-variation-settings: "wdth" 75;font-size: 1.2rem; font-weight: 500; line-height: 1; letter-spacing: 0.3em; color: #ffffff;position: absolute; top: -18px; left: 0;}

.card_wide .card_img {width: 50%; max-width: 510px; background: #ffffff; border-radius: 10px;display: flex;justify-content: center;align-items: center; padding: 0 10px;}
.card_wide .card_img img {width: 100%; max-width: 440px;background: #ffffff; border-radius: 10px;display: flex;justify-content: center;align-items: center; -webkit-transition: all .3s;transition: all .3s;}
.card_wide .card_txt {width: 70%;display: flex;justify-content: flex-start;align-items: flex-start;flex-direction: column; gap:20px;}
.card_wide p {width: 100%; font-size: 1.6rem; font-weight: 500; line-height: 1.75; color: #005ca1; text-align: justify;}
.card_wide .card_link {width: 100%; display: flex;justify-content: space-between;align-items: stretch;flex-direction: row; gap:30px;}

.card_wide .card_link a{height: 42px; width: 50%; font-size: 1.6rem; font-weight: 500; line-height: 1; color: #ffffff;display: flex; justify-content:space-between;align-items: center; flex-direction: row;  border-radius: 5px 21px 21px 5px ; padding: 0 15px 0 20px;background-image: linear-gradient(135deg, rgba(0, 92, 161, 1), rgba(91, 193, 216, 1));background-size:100% 200px;-webkit-transition: all .3s;transition: all .3s;}
.card_wide .card_link a::after {content:"\e901"; font-family: 'icomoon' !important; font-size: 0.8em; -webkit-transition: all .3s;transition: all .3s;}

@media screen and (min-width: 768px) {
#concept .card_wrap .card:hover {background: #d9e0ed ;}
#concept .card_wrap .card:hover .card_img img{ transform:scale(1.05, 1.05);}
#concept .card_wrap .card:hover .arrow_btn {width: 200px;}

.card_wide:hover {background: #d9e0ed ;}
.card_wide .card_link a:hover{background-position:0 100%;padding: 0 10px 0 20px;}
.card_wide:hover .card_img img {transform:scale(1.05, 1.05);}
}



#news {width: 100%; background-color: #f2f4f8;background-image: url("../img/news_bg.png");background-size: 492px auto; background-repeat: no-repeat; background-position: top -50px left -40px;}
#news .news_inner {position: relative;height: 100%;width: 100%; max-width: 1400px; display: grid; grid-template-columns: 252px auto; gap:70px; align-items: start; margin: 0 auto;z-index: 2; padding: 85px 0;}
#news .news_title {width: 100%;display: flex;justify-content: flex-start;align-items: flex-start;flex-direction: column; gap:20px;}
#news h3 {font-size: 1.6rem; font-weight: 500; line-height: 1; color: #005ca1;display: flex;justify-content: flex-start;align-items: flex-start;flex-direction: column; }
#news h3 span {display: block; font-family: "Roboto", sans-serif; font-size: 11rem; font-variation-settings: "wdth" 75;font-weight: 500; line-height: 1; background-image: linear-gradient(135deg, rgba(0, 92, 161, 1), rgba(91, 193, 216, 1));margin-left: -5px;-webkit-background-clip:text;-webkit-text-fill-color: transparent;}
#news .news_title a {height: 42px; width: 100%;; font-size: 1.6rem; font-weight: 500; line-height: 1; color: #ffffff;display: flex; justify-content:space-between;align-items: center; flex-direction: row; background: #005083; border-radius: 5px 21px 21px 5px ; padding: 0 15px 0 20px;-webkit-transition: all .3s;transition: all .3s;}
#news .news_title a::after {content:"\e901"; font-family: 'icomoon' !important; font-size: 0.8em; -webkit-transition: all .3s;transition: all .3s;}
@media screen and (min-width: 768px) {
#news .news_title a:hover{padding: 0 10px 0 20px; background: #00afcc;}
}
#news .news_wrap {width: 100%; background: #ffffff; border-radius: 20px;padding: 40px 60px;}
#news .news_wrap dl {width:100%; height: auto;border-bottom: 1px solid #909bae;padding: 25px 0; position: relative;display: grid; grid-template-columns: 95px auto; gap:20px; padding-right: 40px;color: #22385d;-webkit-transition: all .3s;transition: all .3s}
#news .news_wrap dl:last-of-type  {border-bottom: none;}
#news .news_wrap dl::after {content: "\e901";font-size: 1.2rem; font-family: 'icomoon' !important; speak: never;font-style: normal;font-weight: normal;font-variant: normal;text-transform: none;line-height: 1; position: absolute; top:50%; transform: translate(-50%, 0); right: 10px;-webkit-transition: all .3s;transition: all .3s} 
#news .news_wrap dl dt {width:auto; height: auto; font-family: "Roboto", sans-serif;font-size: 1.6rem; font-weight: 500; line-height: 1.5; white-space: nowrap;display: flex;justify-content: flex-start;align-items: center; flex-direction: row;-webkit-transition: all .3s;transition: all .3s}
#news .news_wrap dl dd {width:100%; height: auto; font-size: 1.6rem; font-weight: 500; line-height: 1.5; display: flex;justify-content: space-between;align-items: center; flex-direction: row;-webkit-transition: all .3s;transition: all .3s}
@media screen and (min-width: 768px) {
#news .news_wrap dl:hover {color: #00afcc;}
#news .news_wrap dl:hover::after {right: 0; }
}

@media screen and (max-width: 1450px) {
#news .news_inner  {padding-left: 25px; padding-right: 25px;}
}

@media screen and (max-width: 1200px) {
#mv.main-top {height: 600px;}
.mv_txt {width: 120px; height: auto;position: absolute; top: 100px;left: 50%;transform: translate(-50%, 0); }
.mv_img {width: 400px; height: auto;position: absolute; bottom: 0;right: -80px;}
.mv_logo {width: 180px; height: auto;position: absolute; bottom: 100px;left: 90px;}
.mv_catch {width: 350px; height: auto;position: absolute; bottom: 30px;left: 20px;}
}


@media screen and (max-width: 768px) {

/* MV */
#mv.main-top {height: 600px;width: 100%;}
.mv_txt {width: 80px; height: auto;position: absolute; top: 80px;left: 50%;transform: translate(-50%, 0); }
.mv_img {width: 255px; height: auto;position: absolute; bottom: 0;right: -55px;}
.mv_logo {width: 115px; height: auto;position: absolute; bottom: 55px;left: 45px;}
.mv_catch {width: 174px; height: auto;position: absolute; bottom: 25px;left: 15px;}


/* Concept */

#concept .concept_inner {padding: 20px 20px 60px 20px;}

#concept::before {content:""; width: 100%; height: 100%; background-image: url("../img/index_bg.png"); background-size: 150vw auto; background-repeat: no-repeat; background-position: top 0 right -65vw; position: absolute; top: 0; left: 0; mix-blend-mode:overlay; z-index: 0; opacity: 0.6;}
#concept .concept_txt {font-size: 1.5rem; font-weight: 700; line-height: 2; color: #ffff8a; margin-bottom: 60px;}
#concept h3 {font-size: 1.4rem; font-weight: 500; line-height: 1; color: #ffffff;display: flex;justify-content: flex-start;align-items: flex-start;flex-direction: column; margin-bottom: 40px;}
#concept h3 span {font-size: 6rem; }

#concept .card_wrap {width: 100%; display: flex;justify-content: flex-start;align-items: flex-start;flex-direction: column; gap:45px;margin-bottom: 40px;}
#concept .card_wrap .card {width: 100%; background: #f2f4f8; display: flex;justify-content: flex-start;align-items: flex-start;flex-direction: column; gap:20px; padding: 20px; border-radius: 20px; position: relative;box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.1);-webkit-transition: all .3s;transition: all .3s;}
#concept .card_wrap .card .card_tab {width: 220px; height: 25px; font-size: 1.3rem; font-weight: 500; line-height: 1; color: #ffffff;clip-path: polygon(15% 0%, 85% 0%, 100% 100%, 0% 100%); background-color: #005083; display: flex;justify-content: center;align-items: center; position: absolute; top: -25px; left: 50%;transform: translate(-50%, 0); }
#concept .card_wrap .card .card_img {width: 100%; height: 200px; background: #ffffff; border-radius: 10px;display: flex;justify-content: center;align-items: center; }
#concept .card_wrap .card:first-of-type .card_img img{width: 100%; max-width: 200px; -webkit-transition: all .3s;transition: all .3s;}
#concept .card_wrap .card:first-of-type::after {content: "・CAREER INFORMATION FORUM"; width: auto;font-family: "Roboto", sans-serif; font-variation-settings: "wdth" 75;font-size: 1rem; font-weight: 500; line-height: 1; letter-spacing: 0.3em; writing-mode: vertical-rl;color: #ffffff;position: absolute; top: 0; right: -15px;}
#concept .card_wrap .card:last-of-type .card_img img{width: 100%; max-width: 220px; -webkit-transition: all .3s;transition: all .3s;}
#concept .card_wrap .card:last-of-type::after {content: "・KOUSOTSU JOBNAVI"; width: auto;font-family: "Roboto", sans-serif; font-variation-settings: "wdth" 75;font-size: 1rem; font-weight: 500; line-height: 1; letter-spacing: 0.3em; writing-mode: vertical-rl;color: #ffffff;position: absolute; top: 0; right: -15px;}
#concept .card_wrap .card p {font-size: 1.4rem; font-weight: 500; line-height: 1.75; color: #005ca1;}
#concept .card_wrap .card .arrow_btn {width: 40px; height: 40px; font-size: 1.2rem; line-height: 1; color: #ffffff; display: flex;justify-content: center;align-items: center; background-image: linear-gradient(135deg, rgba(0, 92, 161, 1), rgba(91, 193, 216, 1)); border-radius: 20px; margin: 0 auto;-webkit-transition: all .3s;transition: all .3s;}

.card_wide {width: 100%; background: #f2f4f8; display: flex;justify-content: space-between;align-items: stretch;flex-direction: column; gap:20px; padding: 20px; border-radius: 20px; position: relative;box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.1);-webkit-transition: all .3s;transition: all .3s;}
.card_wide:last-of-type::after {content: "・IN-SCHOOL CAREER GUIDANCE"; width: auto;font-family: "Roboto", sans-serif; font-variation-settings: "wdth" 75;font-size: 1rem; font-weight: 500; line-height: 1; letter-spacing: 0.3em; writing-mode: vertical-rl;color: #ffffff;position: absolute; top: 0; right: -15px;left: inherit;}
.card_wide .card_img {width: 100%; max-width: 510px; height: 200px;background: #ffffff; border-radius: 10px;display: flex;justify-content: center;align-items: center; padding: 0 10px;}
.card_wide .card_img img {width: 100%; max-width: 440px;background: #ffffff; border-radius: 10px;display: flex;justify-content: center;align-items: center; -webkit-transition: all .3s;transition: all .3s;}
.card_wide .card_txt {width: 100%;display: flex;justify-content: flex-start;align-items: flex-start;flex-direction: column; gap:20px;}
.card_wide p {width: 100%; font-size: 1.4rem; font-weight: 500; line-height: 1.75; color: #005ca1;}
.card_wide .card_link {width: 100%; display: flex;justify-content: space-between;align-items: stretch;flex-direction: column; gap:10px;}

.card_wide .card_link a{height: 42px; width: 100%; font-size: 1.4rem; font-weight: 500; line-height: 1; color: #ffffff;display: flex; justify-content:space-between;align-items: center; flex-direction: row;  border-radius: 5px 21px 21px 5px ; padding: 0 15px 0 15px;background-image: linear-gradient(135deg, rgba(0, 92, 161, 1), rgba(91, 193, 216, 1));background-size:100% 200px;-webkit-transition: all .3s;transition: all .3s;}
.card_wide .card_link a::after {content:"\e901"; font-family: 'icomoon' !important; font-size: 0.8em; -webkit-transition: all .3s;transition: all .3s;}


#news {width: 100%; background-color: #f2f4f8;background-image: url("../img/news_bg.png");background-size: 300px auto; background-repeat: no-repeat; background-position: top -20px left -20px; padding: 0 20px;}
#news .news_inner {position: relative;height: 100%;width: 100%; max-width: 1400px; display: flex;justify-content: flex-start;align-items: flex-start;flex-direction: column;margin: 0 auto;z-index: 2; gap:30px; padding: 40px 0;}
#news .news_title {width: 100%;display: flex;justify-content: flex-start;align-items: flex-end;flex-direction: row; gap:30px;}
#news h3 {font-size: 1.4rem; font-weight: 500; line-height: 1; color: #005ca1;display: flex;justify-content: flex-start;align-items: flex-start;flex-direction: column; }
#news h3 span {display: block; font-family: "Roboto", sans-serif; font-size: 6rem; font-variation-settings: "wdth" 75;font-weight: 500; line-height: 1; background-image: linear-gradient(135deg, rgba(0, 92, 161, 1), rgba(91, 193, 216, 1));margin-left: -5px;-webkit-background-clip:text;-webkit-text-fill-color: transparent;}
#news .news_title a {height: 42px; width: 100%;; font-size: 1.4rem; font-weight: 500; line-height: 1; color: #ffffff;display: flex; justify-content:space-between;align-items: center; flex-direction: row; background: #005083; border-radius: 5px 21px 21px 5px ; padding: 0 15px 0 15px;-webkit-transition: all .3s;transition: all .3s; margin-bottom: 10px;}
#news .news_title a::after {content:"\e901"; font-family: 'icomoon' !important; font-size: 0.8em; -webkit-transition: all .3s;transition: all .3s;}

#news .news_wrap {width: 100%; background: #ffffff; border-radius: 20px;padding: 20px;}
#news .news_wrap dl {width:100%; height: auto;border-bottom: 1px solid #909bae;padding: 20px 0; position: relative;display: flex;justify-content: flex-start;align-items: flex-start;flex-direction: column;gap:5px; padding-right: 30px;color: #22385d;-webkit-transition: all .3s;transition: all .3s}
#news .news_wrap dl:last-of-type  {border-bottom: none;}
#news .news_wrap dl::after {content: "\e901";font-size: 1.2rem; font-family: 'icomoon' !important; speak: never;font-style: normal;font-weight: normal;font-variant: normal;text-transform: none;line-height: 1; position: absolute; top:50%; right: 0;-webkit-transition: all .3s;transition: all .3s} 
#news .news_wrap dl dt {width:auto; height: auto; font-family: "Roboto", sans-serif;font-size: 1.6rem; font-weight: 500; line-height: 1.5; white-space: nowrap;display: flex;justify-content: flex-start;align-items: center; flex-direction: row;-webkit-transition: all .3s;transition: all .3s}
#news .news_wrap dl dd {width:100%; height: auto; font-size: 1.4rem; font-weight: 500; line-height: 1.5; display: flex;justify-content: space-between;align-items: center; flex-direction: row;-webkit-transition: all .3s;transition: all .3s}


}





/*========================================
footer
=======================================*/


footer {width: 100%;background-image: linear-gradient(135deg, rgba(34, 56, 93, 1), rgba(0, 92, 161, 1)); padding: 20px 0 70px 0;}
.footer_company_img {width: 95%; max-width: 1650px; opacity: 0.4;margin: 0 auto;}
.footer_company_img img{width: 100%;}

.fotter_inner { width:100%; max-width: 1400px; margin: 0 auto; padding-top: 30px;}

.fotter_inner section {width: 100%; display: flex;justify-content: space-between; flex-direction: row; align-items: stretch; padding:0}
.footer_addres {width: auto; font-size: 1.6rem; font-weight: 400; line-height: 1.8; color: #ffffff;display: flex;justify-content:flex-start;flex-direction: column; align-items: flex-start; gap:30px; white-space: nowrap;}
.footer_addres img{width: 354px; height: auto;}

.footer_addres a[href^="tel:"]{color: #ffffff;}
@media screen and (min-width: 768px) {
.footer_addres a:hover[href^="tel:"]{color: #ffffff;}
}

.fotter_navi {width: 100%; display: flex;justify-content: flex-start; flex-direction: column; align-items: flex-end; padding-top: 20px;}
.fotter_navi ul{width: auto;display: flex;justify-content: center; flex-direction: row; align-items: center; gap:30px;}
.fotter_navi ul li{width: auto; font-size: 1.6rem; font-weight: 500; line-height: 1; white-space: nowrap;}
.fotter_navi ul li a{color: #ffffff;}
.fotter_navi ul li:last-of-type a {height: 42px; width: 175px; font-size: 1.6rem; font-weight: 500; line-height: 1; color: #005ca1;display: flex; justify-content:space-between;align-items: center; flex-direction: row; background: #ffffff; border-radius: 5px 21px 21px 5px ; padding: 0 15px 0 20px;-webkit-transition: all .3s;transition: all .3s;}
.fotter_navi ul li:last-of-type a::after {content:"\e901"; font-family: 'icomoon' !important; font-size: 0.8em; -webkit-transition: all .3s;transition: all .3s;}
@media screen and (min-width: 768px) {
.fotter_navi ul li:last-of-type a:hover{padding: 0 10px 0 20px;background: #00afcc; color: #ffffff;}
}
.fotter_navi p {font-size: 1.4rem; font-weight: 500; line-height: 1.5; color: #ffffff; margin-top: auto;}

@media screen and (min-width: 768px) {
.fotter_navi ul li a:hover{color: #00afcc;}
}


@media screen and (max-width: 1450px) {
.fotter_inner   {padding-left: 25px; padding-right: 25px;}
.footer_company_img {width: 100%; padding-left: 25px; padding-right: 25px;}
}


@media screen and (max-width: 768px) {
footer {width: 100%;background-image: linear-gradient(135deg, rgba(34, 56, 93, 1), rgba(0, 92, 161, 1)); padding: 20px 0 40px 0;}
.footer_company_img {width: 95%; max-width: 1650px; opacity: 0.4;margin: 0 auto;}
.footer_company_img img{width: 100%;}

.fotter_inner { width:100%; max-width: 1400px; margin: 0 auto; padding-top: 30px;}

.fotter_inner section {width: 100%; display: flex;justify-content: space-between; flex-direction: column; align-items: stretch; padding:0}
.footer_addres {width: 100%; font-size: 1.2rem; font-weight: 400; line-height: 1.8; color: #ffffff;display: flex;justify-content:flex-start;flex-direction: column; align-items: flex-start; gap:20px; white-space: nowrap; }
.footer_addres img{width: 250px; height: auto;}

.footer_addres a[href^="tel:"]{color: #ffffff;}
@media screen and (min-width: 768px) {
.footer_addres a:hover[href^="tel:"]{color: #ffffff;}
}

.fotter_navi {width: 100%; display: flex;justify-content: flex-start; flex-direction: column; align-items: center; padding-top: 40px;}
.fotter_navi ul{width: 100%;display: flex;justify-content: center; flex-direction: column; align-items: center; gap:20px; margin-bottom: 40px;}
.fotter_navi ul li{width: 100%; font-size: 1.4rem; font-weight: 500; line-height: 1; white-space: nowrap;}
.fotter_navi ul li a{color: #ffffff;}
.fotter_navi ul li:last-of-type a {height: 42px; width: 100%; font-size: 1.4rem; font-weight: 500; line-height: 1; color: #005ca1;display: flex; justify-content:space-between;align-items: center; flex-direction: row; background: #ffffff; border-radius: 5px 21px 21px 5px ; padding: 0 15px 0 20px;-webkit-transition: all .3s;transition: all .3s;}
.fotter_navi ul li:last-of-type a::after {content:"\e901"; font-family: 'icomoon' !important; font-size: 0.8em; -webkit-transition: all .3s;transition: all .3s;}
@media screen and (min-width: 768px) {
.fotter_navi ul li:last-of-type a:hover{padding: 0 10px 0 20px;background: #00afcc; color: #ffffff;}
}
.fotter_navi p {font-size: 1.4rem; font-weight: 500; line-height: 1.5; color: #ffffff; margin-top: auto;}

@media screen and (min-width: 768px) {
.fotter_navi ul li a:hover{color: #00afcc;}
}


@media screen and (max-width: 1450px) {
.fotter_inner   {padding-left: 25px; padding-right: 25px;}
.footer_company_img {width: 100%; padding-left: 25px; padding-right: 25px;}
}

}






/*========================================
WP用見出し
=======================================*/

.wp_body h1 {font-size: 3.8rem; line-height: 1.4em; font-weight: 600; }
.wp_body h2 {font-size: 3.2rem; line-height: 1.4em; font-weight: 600; }
.wp_body h3 {font-size: 2.8rem; line-height: 1.4em; font-weight: 600; }
.wp_body h4 {font-size: 2.4rem; line-height: 1.4em; font-weight: 500; }
.wp_body h5 {font-size: 2rem; line-height: 1.4em; font-weight: 500; }
.wp_body h6 {font-size: 1.8rem; line-height: 1.4em; font-weight: 500; }

@media screen and (max-width: 768px) {
.wp_body h1 {font-size: 3rem; line-height: 1.4em; font-weight: 600; }
.wp_body h2 {font-size: 2.6rem; line-height: 1.4em; font-weight: 600; }
.wp_body h3 {font-size: 2.2rem; line-height: 1.4em; font-weight: 600; }
.wp_body h4 {font-size: 2rem; line-height: 1.4em; font-weight: 500; }
.wp_body h5 {font-size: 1.8rem; line-height: 1.4em; font-weight: 500; }
.wp_body h6 {font-size: 1.6rem; line-height: 1.4em; font-weight: 500; }
}


/*========================================
loader
=======================================*/
#loader-bg {display: none;position: fixed;justify-content:center;align-items: center;width: 100vw;height: 100vh;background: #ffffff;opacity:1;z-index: 300; background-image: url("../img/load_logo.svg"); background-position: center center; background-size: 10vw auto; background-repeat: no-repeat;}

@media screen and (max-width: 768px) {
}


/*========================================
effect
=======================================*/

.bg_an_30 {animation: fuwafuwa 30s ease-in-out infinite alternate;}
.bg_an_40 {animation: fuwafuwa 60s ease-in-out infinite alternate;}
.bg_an_50 {animation: fuwafuwa 90s ease-in-out infinite alternate;}







/*========================================
Animation
=======================================*/



.mv_faderight {
animation-name:mvfaderightAnime;
animation-duration:2s;
animation-fill-mode:forwards;

opacity: 0;
}
@keyframes mvfaderightAnime{
  from {
    opacity: 0;
  transform: translateX(100px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}


.mvfadeup {
animation-name:mvfadeUpAnime;
animation-duration:1.5s;
animation-fill-mode:forwards;

opacity: 0;
}
@keyframes mvfadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(50px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}

.mvfadedown {
animation-name:mvfadedownAnime;
animation-duration:1.5s;
animation-fill-mode:forwards;

opacity: 0;
}
@keyframes mvfadedownAnime{
  from {
    opacity: 0;
  transform: translateY(-50px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}




.fadeleftTrigger,.faderightTrigger,.fadedownTrigger,.fadedownTrigger02,.fadeupTrigger{opacity: 0;}





.fadeleft {
animation-name:fadeleftAnime;
animation-duration:2s;
animation-fill-mode:forwards;

opacity: 0;
}
@keyframes fadeleftAnime{
  from {
    opacity: 0;
  transform: translateX(-100px);
  }

  to {
    opacity: 1;
  transform: translateX(0);
  }
}



.faderight {
animation-name:faderightAnime;
animation-duration:2s;
animation-fill-mode:forwards;

opacity: 0;
}
@keyframes faderightAnime{
  from {
    opacity: 0;
  transform: translateX(100px);
  }

  to {
    opacity: 1;
  transform: translateX(0);
  }
}


.fadeup {
animation-name:fadeUpAnime;
animation-duration:1.5s;
animation-fill-mode:forwards;

opacity: 0;
}
@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(100px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}


.mvfade {
animation-name:mvfadeAnime;
animation-duration:3s;
animation-fill-mode:forwards;

opacity: 0;
}
@keyframes mvfadeAnime{
  from {
    opacity: 0;
  transform: translateY(50px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}



.fadedown {
animation-name:fadedownAnime;
animation-duration:2s;
animation-fill-mode:forwards;

opacity: 0;
}
@keyframes fadedownAnime{
  from {
    opacity: 0;
  transform: rotate(-90deg);
  }

  to {
    opacity: 1;
  transform:rotate(0);
  }
}

.fadedown02 {
animation-name:fadedownAnime02;
animation-duration:2s;
animation-fill-mode:forwards;
opacity: 0;
}
@keyframes fadedownAnime02{
  from {
    opacity: 0;
  transform: rotate(-90deg);
  }

  to {
    opacity: 1;
  transform:rotate(0);
  }
}




@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}


.animate {opacity: 0; }
.fade-in {transform: translateY(120px); transition: opacity 0.5s ease, transform 0.5s ease; }
.zoom-in {transform: scale(0.2); transition: opacity 0.5s ease, transform 0.5s ease; }
.show {opacity: 1; transform: translateY(0) scale(1) translateX(0) rotateY(0); }


/* アニメーションスタートの遅延時間を決めるCSS*/
.delay-time02{animation-delay: 0.2s;}
.delay-time04{animation-delay: 0.4s;}
.delay-time06{animation-delay: 0.6s;}
.delay-time10{animation-delay: 1s;}
.delay-time12{animation-delay: 1.2s;}
.delay-time20{animation-delay: 2s;}
.delay-time23{animation-delay: 2.3s;}
.delay-time30{animation-delay: 3s;}