@charset "utf-8";/* CSS Document */*, ::before, ::after {  box-sizing: border-box;}html {  font-size: 62.5%;}body {  position: relative;  width: 100%;  margin: 0;  padding: 0;  font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";  font-style: normal;  font-weight: normal;  font-size: 1.2rem;  color: #333;  -webkit-text-size-adjust: none;  -webkit-font-smoothing: antialiased;  z-index: 0;  font-feature-settings: "pkna"1;  overflow-x: hidden;    letter-spacing: .1em;    line-height: 1.6;}a {  text-decoration: none;}h1, h2, h3, h4, h5, h6 {  margin-bottom: 0;  font-weight: 400;  font-size: inherit;  font-feature-settings: "palt";  line-height: 1.65;}p {  margin-bottom: 0;}pre {  margin-bottom: 0;}dl {  margin-bottom: 0;}ul {  margin-bottom: 0;}ol {  margin-bottom: 0;  list-style: decimal;  padding-left: 1em;}img{    max-width: 100%;}.f_ro{    font-family: "Roboto", sans-serif;}/*-----------------------------------------------------------------ハンバーガーメニュー-----------------------------------------------------------------*/#g-nav{    /*position:fixed;にし、z-indexの数値を大きくして前面へ*/    position:fixed;    z-index: 999;    /*ナビのスタート位置と形状*/  top:0;    right: -120%;  width:100%;    height: 100vh;/*ナビの高さ*/  background:#3A9AD9;    /*動き*/  transition: all 0.6s;}/*アクティブクラスがついたら位置を0に*/#g-nav.panelactive{    right: 0;}/*ナビゲーションの縦スクロール*/#g-nav.panelactive #g-nav-list{    /*ナビの数が増えた場合縦スクロール*/    position: fixed;    z-index: 999;     width: 100%;    height: 100vh;/*表示する高さ*/    overflow: auto;    -webkit-overflow-scrolling: touch;}/*ナビゲーション*/#g-nav ul {    /*ナビゲーション天地中央揃え*/    position: absolute;    z-index: 999;    top:50%;    left:50%;    transform: translate(-50%,-50%);}/*リストのレイアウト設定*/#g-nav li{  list-style: none;    text-align: center;}#g-nav li a{  color: #FFFFFF;  text-decoration: none;  padding:10px;  display: block;  text-transform: uppercase;  letter-spacing: 0.1em;  font-weight: bold;    font-size: 1.6rem;}/*========= ボタンのためのCSS ===============*/.openbtn1{  position:fixed;    z-index: 9999;/*ボタンを最前面に*/  top:10px;  right: 10px;  cursor: pointer;    width: 50px;    height:50px;    background: #3A9AD9;}  /*×に変化*/  .openbtn1 span{    display: inline-block;    transition: all .4s;    position: absolute;    left: 14px;    height: 3px;    border-radius: 2px;  background-color: #FFFFFF;    width: 45%;  }.openbtn1 span:nth-of-type(1) {  top:15px; }.openbtn1 span:nth-of-type(2) {  top:23px;}.openbtn1 span:nth-of-type(3) {  top:31px;}.openbtn1.active span:nth-of-type(1) {    top: 18px;    left: 18px;    transform: translateY(6px) rotate(-45deg);    width: 30%;}.openbtn1.active span:nth-of-type(2) {  opacity: 0;}.openbtn1.active span:nth-of-type(3){    top: 30px;    left: 18px;    transform: translateY(-6px) rotate(45deg);    width: 30%;}/*==================================================メインビジュアル===================================*/.mv{    position: relative;}.slider {  position:relative;	z-index: 0;	/*↑z-indexの値をh1のz-indexの値よりも小さくして背景に回す*/	height: 40vw;/*スライダー全体の縦幅を画面の高さいっぱい（100vh）にする*/    max-width: 98%;    margin: 0 auto;}/*　背景画像設定　*/.slider-item01 {    background:url("images/main01.png");}.slider-item02 {    background:url("images/main02.png");}.slider-item {    width: 100%;/*各スライダー全体の横幅を画面の高さいっぱい（100%）にする*/    height:40vw;/*各スライダー全体の縦幅を画面の高さいっぱい（100vh）にする*/    background-repeat: no-repeat;/*背景画像をリピートしない*/    background-position: center;/*背景画像の位置を中央に*/    background-size: cover;/*背景画像が.slider-item全体を覆い表示*/}/*矢印の設定*/.slick-prev, .slick-next {    display: none!important;    position: absolute;	z-index: 3;    top: 42%;    cursor: pointer;/*マウスカーソルを指マークに*/    outline: none;/*クリックをしたら出てくる枠線を消す*/    border-top: 2px solid #fff;/*矢印の色*/    border-right: 2px solid #fff;/*矢印の色*/    height: 25px;    width: 25px;}.slick-prev {/*戻る矢印の位置と形状*/    left:2.5%;    transform: rotate(-135deg);}.slick-next {/*次へ矢印の位置と形状*/    right:2.5%;    transform: rotate(45deg);}/*ドットナビゲーションの設定*/.slick-dots {    display: none!important;	position: relative;	z-index: 3;    text-align:center;	margin:-50px 0 0 0;/*ドットの位置*/}.slick-dots li {    display:inline-block;	margin:0 5px;}.slick-dots button {    color: transparent;    outline: none;    width:8px;/*ドットボタンのサイズ*/    height:8px;/*ドットボタンのサイズ*/    display:block;    border-radius:50%;    background:#fff;/*ドットボタンの色*/}.slick-dots .slick-active button{    background:#333;/*ドットボタンの現在地表示の色*/}/*--------------------------------------------------------------------------*/.header_inner{    display: flex;    justify-content: space-between;    padding: 10px 20px;}.h1{    background: #354458;    padding: 5px 10px;    color: #FFFFFF;}.gnav{    display: flex;    gap: 3vw;    justify-content: space-between;    padding-top: 20px;    margin-right: 100px;}.gnav li{    font-size: max(1vw , 18px);    text-align: center;    font-weight: 600;}.gnav li span{    display: block;    color: #D9333F;    font-size: 16px;}.tel_contact{    position: absolute;    display: flex;    gap:20px;    top: 0;    right: 100px;}.h_tel{    color: #FFFFFF;    font-size: 18px;    padding-left: 30px;    line-height: 0.8;    padding-top: 8px;}.h_tel span{    padding-left: 10px;}.catch{    position: absolute;    bottom: 20px;    left: 30px;    padding: 2vw;    background: rgba(0,0,0,0.50);    color: #FFFFFF;    font-weight: 600;    max-width: 800px;}.main_catch{    font-size: max(3vw , 2.8rem);    margin-bottom: 20px;}.catch p{    font-size: max(1vw , 16px);}main{    background: #D5DCE5;}.news{    padding: 30px 3% 80px;}.news_inner{    max-width: 1380px;    margin: 0 auto;    display: flex;    flex-wrap: wrap;}.news_ttl{    width: 30%;    padding: 30px 20px;    background: #3A9AD9;    color: #FFFFFF;    font-size: max(1.4vw , 24px);    font-weight: 600;    text-align: center;}.news_ttl span{    font-size: max(1vw , 18px);}.news_txt{    width: 70%;    padding: 30px;    background: #FFFFFF;}.news_list{    display: flex;    flex-wrap: wrap;    font-size: max(1vw , 18px);}.news_list dt{    width: 20%;    padding-bottom: 20px;    margin-bottom: 20px;    border-bottom: 1px solid #333333;}.news_list dd{    width: 80%;    padding-bottom: 20px;    margin-bottom: 20px;    border-bottom: 1px solid #333333;}.news_list dd span{    padding: 5px 20px;    background: #3A9AD9;    border-radius: 30px;    color: #FFFFFF;    font-weight: 600;    margin-right: 20px;}.news_txt_inner{    height: 200px;    overflow-y: scroll;    padding: 20px;}.youtube_sec{    padding: 50px 3%;}.youtube {  width: 100%;  aspect-ratio: 16 / 9;    max-width: 900px;    margin: 0 auto;}.youtube iframe {  width: 100%;  height: 100%;}.about{    background-attachment: fixed;  background-position: center;  background-size: cover;  background-repeat: no-repeat;     background-image: url("images/about_bg.png");    padding: 100px 3%;}.about_box{    background: #FFFFFF;    max-width: 1000px;    width: 100%;    padding: 2vw 4vw;    border-top: 10px solid #354458;    margin: 0 auto;}.btn{    margin-top: 50px;}.btn a{    padding: 10px 20px;    background: #3a9ad9;    color: #FFFFFF;    font-size: 18px;    font-weight: 600;}.about_logo{    margin-bottom: 30px;}.sub_ttl{    font-size: max(1.4vw , 20px);    font-weight: bold;    margin-bottom: 50px;}.sub_ttl span{    font-size: max(0.9vw , 16px);}  .center{    text-align: center;}.t18{    font-size: max(1vw , 18px);}.feature{    padding: 100px 3%;    background: url("images/feature_bg.png")no-repeat center / contain;    background-position: top left 40%;    margin-bottom: 50px;}.inner1500{    max-width: 1500px;    width: 100%;    margin: 0 auto;}.inner1200{    max-width: 1200px;    width: 100%;    margin: 0 auto;}.flex{    display: flex;    flex-wrap: wrap;    justify-content: space-between;    gap: 30px 50px;}.flex-3{    width: calc((100% - 100px) / 3);}.flex-2{    width: calc(50% - 50px);}.feature_ttl{    font-size: max(1.2vw , 20px);    font-weight: 600;    padding: 10px 0;}.business{    padding: 80px 0;    background: url("images/business_bg.png")no-repeat top / contain;    background-position: top right 0;    margin-bottom: 50px;}.business .flex{    align-items: center;}.business_img{    width: calc(40% - 25px);}.business_txt{    width: calc(60% - 25px);}.business_list{    padding-left: 5vw;    margin-top: 50px;    font-weight: 600;}.works{    position: relative;    background: url("images/works_bg.png") no-repeat top/ contain;    background-position: top left 0;    padding: 10vw 0 80px;}.works .sub_ttl{    text-align: right;}.right{    text-align: right;}.works_txt{    margin-left: auto;    max-width: 514px;  width: 42%;}.works_img{    width: 40%;}.works_ttl{    font-size: max(1.2vw , 20px);    font-weight: 600;    padding: 10px 0;}.works_table{    width: 96%;    margin: 0 auto;}.works_table th , .works_table td{    font-size: 16px;    padding: 10px;    border: 1px solid #333333;}.works .inner1200{    margin-top: 80px;}.white{    color: #FFFFFF;}.contact{    background: url("images/contact_bg.png") no-repeat center / cover;    padding: 3vw;}.contact_inner{    border: 3px solid #FFFFFF;    padding: 5vw 20px;}.contact_wrap{    max-width: 860px;    width: 100%;    margin: 0 auto;}.contact .flex{    justify-content: space-between;}.contact p.t18{    margin-bottom: 50px;}.footer_inner{    background: #3a9ad9;    padding: 30px 3%;    border-bottom: 1px solid #FFFFFF;}.footer_wrap{    max-width: 1280px;    margin: 0 auto;}.f_name{    font-size: max(1.4vw , 20px);    font-weight: 600;}.f_list{    font-size: 16px;}.f_list li{   margin-bottom: 20px; }.f_logo{    width: calc(30% - 25px)}.footer_txt{    width: calc(70% - 25px);}.copy{font-size: 16px;text-align: center;color: #FFFFFF;    padding: 10px;    background: #3a9ad9;}/*--------------------------------------------------------------------------下層ページ--------------------------------------------------------------------------*/.h2_ttl{    font-size: max(3vw , 3rem);    text-align: center;    font-weight: 600;    color: #FFFFFF;    display: flex;    justify-content: center;    align-items: center;    height: max(25vw , 240px);    background: url("images/h2_ttl.png") no-repeat center / cover;}.sec{    padding: 80px 3%;}.table_company{    max-width: 850px;    width: 100%;    margin: 0 auto;}.company_info{    display: flex;    flex-wrap: wrap;    font-size: max(1vw , 18px);}.company_info dt{    text-align: center;    padding: 15px 20px;    width: 30%;    border-bottom: 1px solid #333333;}.company_info dd{    padding: 15px 20px;    width: 70%;    border-bottom: 1px solid #333333;}.recruit_bnr{    padding: 80px 3%;    text-align: center;}.white_bg{    background: #FFFFFF;}.mb5{    margin-bottom: 50px;}.busines_links{    max-width: 1280px;    width: 100%;    margin: 0 auto;}.business_list2{    display: flex;    flex-wrap: wrap;    justify-content: space-between;    gap: 20px;}.business_list2 li{    width: calc((100% - 80px) / 5);    position: relative;}.business_list2 a{        text-align: center;    background: #66BFF9;    padding: 10px 0;    font-size: 18px;    width: 100%;    display: block;}.business_wrap{    padding: 50px 0;}.re{    flex-direction: row-reverse;}.works .flex{    gap: 50px 30px;}.red{    color: #FF0000;}.formTable .flex{    justify-content: flex-start;}/*--------------------------------------------------------------------------PC--------------------------------------------------------------------------*/@media only screen and (min-width: 1025px) {  .sp-only {    display: none !important;  }  .tab-only {    display: none !important;  }}/*--------------------------------------------------------------------------tablet--------------------------------------------------------------------------*/@media only screen and (min-width: 768px) and (max-width: 1024px) {  .sp-only {    display: none !important;  }  .pc-only {    display: none !important;  }}/*--------------------------------------------------------------------------sp--------------------------------------------------------------------------*/@media screen and (max-width: 767px) {    .pc-only {    display: none !important;  }  .pc-tab-only {    display: none !important;  }   .tab-only {    display: none !important;  }     .slider {  position:relative;	z-index: 0;	/*↑z-indexの値をh1のz-indexの値よりも小さくして背景に回す*/	height: 110vw;/*スライダー全体の縦幅を画面の高さいっぱい（100vh）にする*/    max-width: 98%;    margin: 0 auto;}/*　背景画像設定　*/.slider-item01 {    background:url("images/sp-main01.png");}.slider-item02 {    background:url("images/sp-main02.png");}.slider-item {    width: 100%;/*各スライダー全体の横幅を画面の高さいっぱい（100%）にする*/    height:110vw;/*各スライダー全体の縦幅を画面の高さいっぱい（100vh）にする*/    background-repeat: no-repeat;/*背景画像をリピートしない*/    background-position: center;/*背景画像の位置を中央に*/    background-size: cover;/*背景画像が.slider-item全体を覆い表示*/}    .catch {  position: absolute;  bottom: 20px;  left: 50%;  padding: 2vw;  background: rgba(0,0,0,0.50);  color: #FFFFFF;  font-weight: 600;  max-width: 90%;  transform: translateX(-50%);  width: 100%;}    .news_ttl {  width: 100%;}    .news_txt {  width: 100%;  padding: 10px;  background: #FFFFFF;}    .news_txt_inner {  padding: 10px;        height: 300px;}    .news_list dt {  width: 100%;  padding-bottom: 10px;  margin-bottom: 0px;  border-bottom: none;}    .news_list dd {  width: 100%;  padding-bottom: 20px;  margin-bottom: 20px;  border-bottom: 1px solid #333333;}    .about_box {  padding: 10vw 5vw;}    .flex-3 {  width: 100%;}    .feature {  background-position: top 50% left 40%;}    .business_img {  width: 90%;  margin: 0 auto;}    .business_txt {  width: 90%;        margin: 0 auto;}    .works_txt {  margin:0 auto;  max-width: 514px;  width: 90%;}    .works_img {  width: 90%;        margin: 0 auto;}    .inner1200    {        width: 90%;    }    .flex-2 {  width: 100%;}    .f_list {  font-size: 16px;  display: flex;  justify-content: center;  gap: 10px 50px;  flex-wrap: wrap;}    .business_list2 li{    width: 100%;}}/*==================================================フェードイン===================================*/.fadeIn{animation-name:fadeInAnime;animation-duration:1s;animation-fill-mode:forwards;opacity:0;}@keyframes fadeInAnime{  from {    opacity: 0;  }  to {    opacity: 1;  }}/* 下から */.fadeUp{animation-name:fadeUpAnime;animation-duration:0.5s;animation-fill-mode:forwards;opacity:0;}@keyframes fadeUpAnime{  from {    opacity: 0;  transform: translateY(100px);  }  to {    opacity: 1;  transform: translateY(0);  }}/* 上から */.fadeDown{animation-name:fadeDownAnime;animation-duration:0.5s;animation-fill-mode:forwards;opacity:0;}@keyframes fadeDownAnime{  from {    opacity: 0;  transform: translateY(-100px);  }  to {    opacity: 1;  transform: translateY(0);  }}/* 左から */.fadeLeft{animation-name:fadeLeftAnime;animation-duration:0.5s;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:0.5s;animation-fill-mode:forwards;opacity:0;}@keyframes fadeRightAnime{  from {    opacity: 0;  transform: translateX(100px);  }  to {    opacity: 1;  transform: translateX(0);  }}/* スクロールをしたら出現する要素にはじめに透過0を指定　*/ .fadeInTrigger,.fadeUpTrigger,.fadeDownTrigger,.fadeLeftTrigger,.fadeRightTrigger{    opacity: 0;}#page-top a{	display: flex;	justify-content:center;	align-items:center;	width: 60px;	height: 60px;	text-align: center;	text-transform: uppercase; 	text-decoration: none;	transition:all 0.3s;}#page-top a:hover{	opacity: .6;}/*リンクを右下に固定*/#page-top {	position: fixed;	right: 10px;	bottom:10px;	z-index: 2;    /*はじめは非表示*/	opacity: 0;	transform: translateX(100px);}/*　左の動き　*/#page-top.LeftMove{	animation: LeftAnime 0.5s forwards;}@keyframes LeftAnime{  from {    opacity: 0;	transform: translateX(100px);  }  to {    opacity: 1;	transform: translateX(0);  }}/*　右の動き　*/#page-top.RightMove{	animation: RightAnime 0.5s forwards;}@keyframes RightAnime{  from {  	opacity: 1;	transform: translateX(0);  }  to {  	opacity: 1;	transform: translateX(100px);  }}.box_con {  max-width: 1050px;  margin: 50px auto 0;    font-size: 18px;    }@media only screen and (max-width: 768px) {  .box_con {    width: 95%;  }}.box_con form {  width: 100%;}.box_con form table {  width: 100%;}.box_con form table tr {  position: relative;}.box_con form table tr:after {  content: "";  position: absolute;  width: 100%;  left: 0;  bottom: 0;  height: 1px;  border-bottom: dotted #cdcdcd 1px;}.box_con form table tr th {  width: 30%;  font-weight: 600;  padding: 1em .5em;  -moz-box-sizing: border-box;  -webkit-box-sizing: border-box;  box-sizing: border-box;}@media only screen and (max-width: 768px) {  .box_con form table tr th {    text-align: center;    width: 100%;    display: block;    background: #3A9AD9;    padding: .8em .2em;    color: #fff;  }}.box_con form table tr th span {  padding: 0 .3em;  color: #FF0000;  margin-left: .5em;  -moz-box-sizing: border-box;  -webkit-box-sizing: border-box;  box-sizing: border-box;}.box_con form table tr td {  padding: 1em .5em;  -moz-box-sizing: border-box;  -webkit-box-sizing: border-box;  box-sizing: border-box;}@media only screen and (max-width: 768px) {  .box_con form table tr td {    padding: 1.5em .5em;    display: block;    width: 100%;  }}.box_con form table tr .box_br {  display: block;}.box_con form table tr select {  border: 1px solid #3A9AD9;}.box_con form table tr label input {  cursor: pointer;  display: none;  vertical-align: middle;}.box_con form table tr .radio02-input + label {  padding-left: 23px;  position: relative;}.box_con form table tr .radio02-input + label:before {  content: "";  display: block;  position: absolute;  top: 50%;  left: 0;  width: 16px;  height: 16px;  border: 1px solid #999;  border-radius: 50%;  -moz-transform: translateY(-50%);  -ms-transform: translateY(-50%);  -webkit-transform: translateY(-50%);  transform: translateY(-50%);}.box_con form table tr .radio02-input:checked + label:after {  content: "";  display: block;  position: absolute;  top: 50%;  left: 3px;  width: 12px;  height: 12px;  background: #3A9AD9;  border-radius: 50%;  -moz-transform: translateY(-50%);  -ms-transform: translateY(-50%);  -webkit-transform: translateY(-50%);  transform: translateY(-50%);}.box_con form table tr select, .box_con form table tr input, .box_con form table tr textarea {  width: 100%;  height: 3em;  padding: .5em;  -moz-box-sizing: border-box;  -webkit-box-sizing: border-box;  box-sizing: border-box;    border: 1px solid #333333;    background: #FFFFFF;    border-radius: 10px;}.box_con form table tr textarea {  height: 10em;}/*プライバシーのデザインcss↓*/.con_pri {  max-width: 700px;  margin: 0  auto;}@media only screen and (max-width: 768px) {  .con_pri {    width: 95%;  }}.con_pri .box_pri {  height: 300px;  overflow-y: scroll;  border: 1px solid #cdcdcd;  background: #f7f7f7;  -moz-box-sizing: border-box;  -webkit-box-sizing: border-box;  box-sizing: border-box;  margin-top: 20px;  padding: 20px 55px;}@media only screen and (max-width: 768px) {  .con_pri .box_pri {    margin-top: 4%;    padding: 3%;  }}@media only screen and (min-width: 769px) and (max-width: 1024px) {  .con_pri .box_pri {    padding: 4%;  }}.con_pri .box_pri .box_tori {  text-align: left;  margin-top: 40px;}@media only screen and (max-width: 768px) {  .con_pri .box_pri .box_tori {    margin-top: 4%;  }}.con_pri .box_pri .box_tori h4 {  font-weight: normal;  margin-bottom: 30px;  font-size: 150%;}@media only screen and (max-width: 768px) {  .con_pri .box_pri .box_tori h4 {    margin-bottom: 4%;  }}.con_pri .box_pri .box_tori .txt {  padding: 0 20px;}@media only screen and (max-width: 768px) {  .con_pri .box_pri .box_tori .txt {    padding: 0;  }}.con_pri .box_pri .box_num {  margin-top: 30px;}@media only screen and (max-width: 768px) {  .con_pri .box_pri .box_num {    margin-top: 5%;  }}.con_pri .box_pri .box_num h4 {  font-weight: normal;  font-size: 113%;}.con_pri .box_pri .box_num .txt {  padding: 10px 0 0 20px;}@media only screen and (max-width: 768px) {  .con_pri .box_pri .box_num .txt {    padding: 3% 0 0 3%;  }}.box_check {  text-align: center;  margin: 1em auto;}.box_check label {  display: inline-block;}.box_check label span {  margin-left: .3em;}.btn {  text-align: center;}.btn input {  display: inline-block;  background: #3A9AD9;  padding: .5em 4em;  color: #FFFFFF;  text-decoration: none;  cursor: pointer;  border: none;  -moz-transition: all 0.4s;  -o-transition: all 0.4s;  -webkit-transition: all 0.4s;  transition: all 0.4s;}.btn input:hover {  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);  opacity: 0.7;}