@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Teko:wght@300..700&display=swap');
@import url("default.css");

* {-webkit-text-size-adjust:100%;}
a:link {text-decoration:none; color:#0C0C0C;}
a:visited{text-decoration:none; color:#0C0C0C;}
a:hover{text-decoration:none; color:#0C0C0C;}
a:active{text-decoration:none; color:#0C0C0C;}

.grecaptcha-badge { opacity: 0; pointer-events: none; }
.full-width { margin-left: calc(-50vw + 50%); margin-right: calc(-50vw + 50%); }
.allWrapper { overflow: hidden; }
.container-fluid { max-width: 1240px; padding-left: 30px; padding-right: 30px; }
.container-fluid .container-fluid { padding-left: 0; padding-right: 0; }

body { font-size: 16px; line-height: 2; letter-spacing: .1em; color: #0C0C0C; background-color: #fff; font-family: "Noto Sans JP", sans-serif; font-weight: 400; min-width: 1300px; }
header { position: fixed; left: 0; top: 0; width: 100%; z-index: 100; background: #fff; transition: .3s; display: flex; justify-content: space-between; border-bottom: 1px solid #3D3D3D; height: 80px; }
header .logo { border-right: 1px solid #3D3D3D; width: 300px; align-items: center; display: flex; justify-content: center; padding: 15px; }
header .gnav { display: flex; justify-content: space-between; align-items: center; width: calc(100% - 380px); }
header .navs1 { display: flex; align-items: center; width: calc(100% - 320px); font-size: 16px; justify-content: center; padding: 0 50px; }
header .navs1 li { margin: 0 20px; white-space: nowrap; }
header .navs2 { display: flex; align-items: center; width: 320px; background-color: #00AED9; height: 80px; }
header .navs2 .snsicons { width: 100px; display: flex; align-items: center; justify-content: center; border-right: 1px solid #fff; height: 80px; }
header .navs2 .contacts a { width: 220px; height: 80px; display: flex; align-items: center; justify-content: center; font-size: 20px; color: #fff; }
header .menu-trg-area { position: fixed; top: 15px; right: 15px; margin: auto; display: none; width: 40px; height: 40px; background: none; border-radius: 3px; cursor: pointer;}
header .menu-trigger,
header .menu-trigger span { display: inline-block; transition: all .4s; box-sizing: border-box;}
header .menu-trigger { position: absolute; width: 33px; height: 22px; z-index: 2; left: 0; right: 0; top: 0; bottom: 0; margin: auto;}
header .menu-trigger span { position: absolute; left: 0; width: 100%; height: 2px; background-color: #00AED9; }
header .menu-trigger span:nth-of-type(1) { top: 0;}
header .menu-trigger span:nth-of-type(2) { top: 10px;}
header .menu-trigger span:nth-of-type(3) { bottom: 0;}
header .menu-trigger.active span:nth-of-type(1) { -webkit-transform: translateY(20px) rotate(-45deg); transform: translateY(20px) rotate(-45deg); top: -10px;}
header .menu-trigger.active span:nth-of-type(2) { left: 50%; opacity: 0; -webkit-animation: active-menu-bar02 .8s forwards; animation: active-menu-bar02 .8s forwards;}
header .menu-trigger.active span:nth-of-type(3) { -webkit-transform: translateY(-20px) rotate(45deg); transform: translateY(-20px) rotate(45deg); bottom: -10px;}
.teko { font-family: "Teko", sans-serif; }
.home_fv { position: relative; }
.home_fv .catch { margin-bottom: -3%; }
.fvSlider { position: relative; }
.fvSlider:before { content: ""; position: absolute; top: -60px; left: -50vw; right: 0; margin: 0 auto; width: 200vw; height: 95%; background-color: #00AED9; }
.fvSlider,
.fvSlider * { overflow: visible!important; }
.fvSlider { transform: rotate(-8.5deg); margin-top: 200px; }
.fvSlider .child { padding: 0 15px; }
.fvSlider .bg { padding-top: 110%;  transform: skewY(-8.5deg) rotate(8.5deg); border-radius: 18px; }
.fvSlider .slick-dots { display: flex; justify-content: flex-end; padding-right: 50px; bottom: -50px; }
.fvSlider .slick-dots li { margin: 0 10px; width: auto; height: auto; }
.fvSlider .slick-dots li button { width: 18px; height: 18px; border-radius: 50%; background: #fff; margin: 0; background-color: none; border: 1px solid #3D3D3D; }
.fvSlider .slick-dots li button:before { display: none; }
.fvSlider .slick-dots li.slick-active button { background: #00AED9; border-color: #00AED9; }
.lines { width: 100%; height: 4px; background-color: #059C4B; position: relative; }
.lines:before { content: ""; position: absolute; top: 0; left: 0; width: 60%; height: 4px; background-color: #00AED9; }
main { padding-top: 80px; }
main#home { padding-top: 180px; }
.color-white { color: #fff!important; }
.home_about { position: relative; margin-top: 120px; }
.home_about:before { content: ""; clip-path: polygon(60% 0, 100% 0, 40% 100%, 0% 100%); background-color: #F6FAFA; position: absolute; top: -100%; left: -7%; width: 140%; height: 350%; z-index: -1;}
.home_about .container-fluid { position: relative; z-index: 1; }
.home_about .photo { position: relative; }
.home_about .photo img { border-radius: 1.5em; overflow: hidden; max-width: none; width: 150%; }
.home_about .contents { position: relative; }
.service_about { position: relative; }
.service_about:before { content: ""; clip-path: polygon(60% 0, 100% 0, 40% 100%, 0% 100%); background-color: #F6FAFA; position: absolute; top: -100%; left: -7%; width: 140%; height: 500%; z-index: -1;}
.service_about p { margin-top: 40px; }
.service_about p { line-height: 2; letter-spacing: .075em; }
.service_about .photo { position: relative; }
.service_about .photo img { position: relative; }
/* .service_about .photo:before { content: ""; width: 120%; height: 0; padding-bottom: 120%; background-color: #f1f1f1; transform: rotate(45deg); display: block; position: absolute; left: 21%; top: 38%; } */
.service_product p { line-height: 2; letter-spacing: .075em; }
.service_product .photo1 { width: 70%; }
.service_product .photo2 { width: 75%; margin-left: auto; margin-top: -15%; }
.large-title { font-size: 30px; font-weight: 600; line-height: 1.5; letter-spacing: .01em; }
.link-button { width: 390px; max-width: 100%; padding: 18px 15px; text-align: center; display: inline-block; position: relative; border: 1px solid #3D3D3D; border-radius: 100px; transition: .3s; }
.link-button:before { content: ""; position: absolute; left: 25px; top: 0; bottom: 0; margin: auto 0; width: 10px; height: 10px; border-top: 1px solid #3D3D3D; border-right: 1px solid #3D3D3D; transform: rotate(45deg); }
.link-button.white { background-color: #fff; }
.link-button:hover { background-color: #00AED9; color: #fff!important; }
.link-button:hover:before { border-color: #fff; }
.section-title { position: relative; padding: 20px 0 3px 80px; line-height: 1.5; margin-bottom: 40px; }
.section-title:before { content: ""; width: 120px; height: 100%; clip-path: polygon(60% 0, 100% 0, 40% 100%, 0% 100%); background-color: #00AED9; position: absolute; left: 0; top: 0; z-index: 0; }
.section-title.noicon { padding-left: 0; }
.section-title.noicon:before { display: none; }
.section-title .en { font-family: "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif; font-size: 48px; font-weight: 600; position: relative; }
.section-title .jp { font-size: 22px; position: relative; }
.service-list { display: flex; flex-wrap: wrap; overflow: hidden; border-radius: 1.5em; }
.service-list li { width: 33.3333%; }
.service-list li a { display: block; padding-top: 65%; position: relative; }
.service-list li a:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,.4); opacity: 0; transition: .3s; }
.service-list li a:hover:before { opacity: 1; }
.service-list li a .contents { position: absolute; left: 0; bottom: 20px; z-index: 1; padding: 0 40px 0; width: 100%; }
.service-list li a .contents .arrow { position: absolute; right: 50px; top: -10px; width: 50px; height: 50px; background-color: #00AED9; border-radius: 100%; display: flex; align-items: center; justify-content: center; }
.service-list li a .contents .arrow:after { content: ""; width: 12px; height: 12px; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: rotate(45deg); position: relative; right: 3px; }
.home_works { margin-top: 125px; background-color: #fff; }
.home_works .wrapper { display: flex; }
.home_works .titles { width: 500px; position: relative; padding-top: 75px; padding-bottom: 70px; padding-right: 30px; z-index: 2; }
.home_works .titles:before { content: ""; background-color: #3D3D3D; position: absolute; top: 0; right: 15px; height: 100%; width: 200vw; border-radius: 2em; }
.home_works .titles * { position: relative; }
.home_works .contents { width: calc(100% - 500px); position: relative; }
.home_works .contents:before { content: ""; position: absolute; right: 100%; top: 0; width: 200vw; height: 100%; background-color: #fff; z-index: 1; }
.works-slider { width: 530px; max-width: 100%; overflow: visible!important; position: static!important; }
.works-slider * { overflow: visible!important; }
.works-slider .slick-slide { padding: 0 15px; }
.works-slider .slick-next { width: 75px; height: 75px; background-color: #fff; display: flex; align-items: center; justify-content: center; border-radius: 100%; right: 30px; transition: .3s; }
.works-slider .slick-next:before { display: none; }
.works-slider .slick-next:after { content: ""; width: 12px; height: 12px; border-top: 2px solid #00AED9; border-right: 2px solid #00AED9; transform: rotate(45deg); position: relative; right: 3px; transition: .3s; }
.works-slider .slick-next:hover { background-color: #00AED9; }
.works-slider .slick-next:hover:after { border-color: #fff; }
.works-slider .slick-prev { width: 75px; height: 75px; display: none; background-color: #fff; display: flex; align-items: center; justify-content: center; border-radius: 100%; left: 30px; transition: .3s; }
.works-slider .slick-prev:before { display: none; }
.works-slider .slick-prev:after { content: ""; width: 12px; height: 12px; border-bottom: 2px solid #00AED9; border-left: 2px solid #00AED9; transform: rotate(45deg); position: relative; left: 3px; transition: .3s; }
.works-slider .slick-prev:hover { background-color: #00AED9; }
.works-slider .slick-prev:hover:after { border-color: #fff; }
.works-card .photo { position: relative; padding-top: 60%; background-size: cover; background-position: center; border-radius: 2em 2em 0 0; }
.works-card .text { border: 1px solid #3D3D3D; border-top: none; border-radius: 0 0 2em 2em; padding: 15px 30px 25px; }
.works-card .text .title { font-size: 24px; font-weight: bold; margin-bottom: 20px; line-height: 1.5; letter-spacing: .01em; }
.works-card .text .details { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden!important; }
.tags { display: flex; flex-wrap: wrap; margin-right: -15px; margin-bottom: 10px; max-height: 78px; overflow: hidden; }
.tags.full { max-height: none;}
.tags span,
.tag-block { background-color: #F6FAFA; display: inline-block; font-size: 14px; padding: 3px 15px; border-radius: 100px; margin-right: 15px; margin-bottom: 5px; transition: .3s; }
.tag-block:hover { background-color: #00AED9; color: #fff!important; }
.tag-block.active { background-color: #00AED9; color: #fff!important; }
.home_recruit { position: relative; margin-top: 120px; }
.common-arrow { position: relative; width: 74px; height: 74px; background-color: #fff; border: 1px solid #3D3D3D; border-radius: 100%; display: flex; align-items: center; justify-content: center; transition: .3s; }
.common-arrow:after { content: ""; width: 12px; height: 12px; border-top: 2px solid #00AED9; border-right: 2px solid #00AED9; transform: rotate(45deg); position: relative; right: 3px; transition: .3s; }
.common-arrow:hover { background-color: #00AED9; border-color: #00AED9; }
.common-arrow:hover:after { border-color: #fff; }
.home_recruit { overflow: hidden; }
.home_recruit .wrapper { position: relative; overflow: hidden; background-attachment: fixed; height: 100vh; min-height: 820px; display: flex; align-items: center; justify-content: center; }
.home_recruit .title { position: absolute; left: 3%; top: 0; width: 53%; z-index: 1; }
.home_recruit .title.fixed { position: fixed; top: 120px; }
.home_recruit .contents { margin-top: 150px; margin-bottom: 150px; }
.home_recruit .container-fluid { position: relative; z-index: 1; }
.home_recruit_wrapper { background: rgba(255, 255, 255, .8); border: 1px solid #3D3D3D; border-radius: 1em; padding: 150px 0; }
.home_news { padding: 100px 0; }
.label-cat { display: inline-block; padding: 1px 18px; background-color: #00AED9; color: #fff; font-size: 14px; }
.news-list { border: 1px solid #D9D9D9; padding: 20px 50px 40px; border-radius: 2em; }
.news-list li a { display: flex; flex-wrap: wrap; padding: 20px 0; border-bottom: 1px solid #D9D9D9; }
.news-list li a .cat { width: 120px; }
.news-list li a .date { width: 110px; }
.news-list li a .name { width: calc(100% - 230px); }
.home_contact { position: relative; margin-bottom: -1px; }
.home_contact:before { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 45%; background-color: #3D3D3D; }
.common-contact .common-arrow:hover { border-color: #fff; }
.common-contact { background-color: #00AED9; padding: 100px 15px 120px; position: relative; transition: .3s; }
footer { background-color: #3D3D3D; color: #fff; padding: 150px 0; font-size: 16px; }
footer a { color: #fff!important; }
footer .sns { display: flex; margin-left: -20px; }
footer .sns li { margin-left: 20px; }
footer .sns img { display: block; }
footer .footer-menu { display: flex; flex-wrap: wrap; }
footer .footer-menu li { margin-right: 40px; }
.tril-image { display: flex; }
.tril-image .image1 { width: 50%; padding-top: 75%; }
.tril-image .image2 { width: 100%; height: 50%; }
.tril-image .image3 { width: 100%; height: 50%; }
.tril-image .wrapper { width: 50%; }

.icon-tril { background: #ffffff; height: calc(tan(60deg) * 6px / 1); width: 6px; clip-path: polygon(0 0, 100% 50%, 0 100%); transition: .3s; }
.icon-tril.blue { background: #00AED9; }
.btn-blue { width: 200px; display: flex; align-items: center; background: #00AED9; border: 1px solid #00AED9; color: #fff!important; justify-content: center; font-weight: 600; letter-spacing: .15em; height: 45px; transition: .3s; }
.btn-blue .icon-tril { margin-left: 15px; }
.btn-blue:hover { background: transparent; color: #00AED9!important; }
.btn-blue:hover .icon-tril { background: #00AED9; }
.sec-title { display: flex; flex-wrap: wrap; align-items: flex-end; line-height: 1; margin-bottom: 50px; }
.sec-title .en { font-size: 54px; letter-spacing: .04em; margin-right: 10px; font-family: "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, 游ゴシック, "Yu Gothic", 游ゴシック体, YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-weight: 700; font-style: italic; }
.sec-title .en span { color: #00AED9; }
.sec-title .jp { font-size: 16px; letter-spacing: .1em; padding-bottom: 12px; font-weight: 600; }
.sec-title.len { display: block; }
.sec-title.len .en { margin-right: 0; }
.sec-title.len .jp { padding-right: 8px; padding-bottom: 0; }
.sec-title.right { text-align: right; }
.sec-title.center { text-align: center; }
.sub-title { font-size: 26px; line-height: 1.71; font-weight: 700; margin-bottom: 40px; letter-spacing: .075em; }
.common-menu { display: flex; flex-wrap: wrap; border: 1px solid #929292; border-bottom: none; border-right: none; max-width: 1000px; margin: 0 auto; }
.common-menu li { width: 33.333%; border-right: 1px solid #929292; text-align: center; border-bottom: 1px solid #929292; }
.common-menu li a { display: block; position: relative; background-color: #fff; font-size: 18px; font-weight: 600; color: #00AED9 !important; padding: 25px 10px 28px; line-height: 1; transition: .3s; }
.link-card { position: relative; display: block; }
.link-card .photo { padding-top: 67.5%; transition: .3s; }
.link-card .contents { background-color: #fff; transition: .3s; position: relative; border-bottom: 2px solid #00AED9; padding-bottom: 60px; padding-top: 20px; }
.link-card .title { font-size: 24px; letter-spacing: .075em; font-weight: 600; }
.link-card .detail { margin-top: 20px; }
.viewmore { background-color: #00AED9; border: 1px solid #00AED9; color: #fff!important; font-family: "Teko", sans-serif; width: 280px; max-width: 100%; margin: 0 auto; display: block; text-align: center; font-size: 30px; letter-spacing: .15em; text-indent: .15em; padding: 10px 15px 7px; transition: .3s; }
.viewmore:hover { background-color: #fff; color: #00AED9!important; }
.bg-card-link { position: relative; padding-top: 75%; display: block; transition: .3s; background-size: 100%; }
.bg-card-link:before { content: ""; position: absolute; left: 15px; top: 15px; height: calc(100% - 30px); width: calc(100% - 30px); border: 1px solid #fff; }
.bg-card-link > div { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; text-align: center; color: #fff; }
.bg-card-link .title { font-size: 34px; letter-spacing: .11em; font-weight: 600; margin-bottom: 20px; }
.bg-card-link:hover { background-size: 110%; }
.scroll_top { position: fixed; right: 0; bottom: 0; width: 100px; height: 100px; display: flex; align-items: center; justify-content: center; background-color: #196b9b; z-index: 5; transition: .3s; opacity: 0; visibility: hidden; }
.scroll_top.active { opacity: 1; visibility: visible; }
.scroll_top:before { content: ""; background: #fff; height: calc(tan(60deg)* 6px / 1); width: 20px; clip-path: polygon(50% 0, 100% 100%, 0 100%); transition: .3s; }
.scroll_top:hover { opacity: .8; }
.js-animation { position: relative; overflow: hidden; }
.js-animation:before { content: ""; width: 100%; height: 200%; transform: skewY(10deg); background-color: #00AED9; display: block; position: absolute; top: -20%; left: 0; z-index: 2; transition: 1.5s; }
.js-animation.is-view:before { top: -300%; }

/* common */
.page-hero { display: flex; align-items: center; justify-content: center; height: 440px; text-align: center; color: #fff!important; margin-top: 0; position: relative; }
.page-hero .section-title { text-align: left; margin-bottom: 0!important; }
.page-hero:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,.2); }
.site-title .en { font-size: 60px; font-family: "Teko", sans-serif; letter-spacing: .15em; line-height: 1; font-weight: 500; }
.site-title .en span { color: #00AED9; }
.site-title .jp { font-size: 16px; font-weight: bold; letter-spacing: .1em; }
.corporate-philosophy h3 { font-weight: bold; border-left: 5px solid #00AED9; font-size: 34px; letter-spacing: .11em; padding-left: 20px; line-height: 1.5; }
.hero_text { border: 4px solid #fff; padding: 40px 185px; }
.hero_text .top { line-height: 1.22; }
.hero_text .top span { font-size: 40px; font-weight: bold; display: inline-block; margin: 0 40px; }
.hero_text .top img.icon { width: 60px; }
.hero_text .bottom { line-height: 1.2; }
.hero_text .bottom span { font-size: 60px; font-weight: bold; display: inline-block; letter-spacing: -.06em; }
.sub-title { position: relative; }
.sub-title.line { display: inline-block; }
.sub-title.line::after { position: absolute; left: 0; right: 0; bottom: -15px; width: 100%; margin: 0 auto; content: ''; height: 5px; }
.sub-title.line.blue::after { background: #00AED9; }
.cube-block { position: relative; padding-top: 100%; text-align: center; }
.cube-block:before { content: ""; position: absolute; left: 3%; top: 3%; width: 94%; height: 94%; border: 1px solid #fff; border-radius: 100%; z-index: 1; pointer-events: none; }
.cube-block .wrapper { position: absolute; background: #00AED9; color: #fff; border-radius: 100%; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
.cube-block .num { font-size: 32px; line-height: 1; position: absolute; top: 30px; left: 0; right: 0; margin: 0 auto; letter-spacing: .02em; border-bottom: 2px solid #fff; width: 30px; white-space: nowrap; padding-bottom: 2px; font-family: "Teko", sans-serif; }
.cube-block .msg { font-size: 21px; letter-spacing: .03em; text-indent: .03em; line-height: 1.41; font-weight: bold; padding-top: 20px; }
.joboffer-sec .maru-icon { display: flex; justify-content: space-between; margin-bottom: 85px;}
.joboffer-sec .maru-icon .offer-flow { width: 30%; }
.withwork-sec .photos-box { display: flex; }
.withwork-sec .photos-box .box { width: 50%; }
.withwork-sec .photos-box .box-01 { width: 50%; }
.withwork-sec .photos-box .box-02 .wrap { width: 50%; }
.detail-title { font-size: 34px; padding-left: 25px; margin-bottom: 30px; font-weight: bold; line-height: 1.1; letter-spacing: .11em; border-left: #00AED9 5px solid; }
.wp-pagenavi .current { background: #00AED9; }
.post-head { border-bottom: 1px solid #c9c9c9; padding-bottom: 20px; margin-bottom: 30px; }
.post-head .time { letter-spacing: .1em; }
.post-head .title { font-weight: bold; letter-spacing: .1em; }
.site-button { border: none; color: #fff!important; display: block; margin-left: auto; margin-right: auto; background: #00AED9; outline: none; line-height: 1; padding: 18px; max-width: 310px; width: 100%; cursor: pointer; }
.site-button2 { border: 1px solid #fff; color: #fff!important; width: 320px; height: 45px; display: flex; align-items: center; justify-content: center; border-radius: 100px; letter-spacing: .2em; position: relative; transition: .3s; max-width: 100%; font-weight: 400; }
.site-button2:after { content: ""; position: absolute; right: 15px; top: 0; bottom: 0; margin: auto 0; width: 6px; height: 12px; clip-path: polygon(0 0, 100% 50%, 0 100%); background-color: #fff; transition: .3s; }
.site-button2:hover { background: #fff; color: #000!important; }
.site-button2:hover:after { background-color: #000; }
.site-button2.center { margin-left: auto; margin-right: auto; }
.category-tag { height: 30px; width: 110px; text-align: center; font-size: 15px; font-weight: bold; letter-spacing: .1em; border: #00AED9 1px solid; color: #00AED9; margin-right: 35px; display: inline-block; }
.name1 { width: 120px; }
.name2 { width: 150px; }
.home_fullbg { padding: 100px 0 90px; }
.home_fullbg img { width: 100%; }
.home_fullbg .wrapper { display: flex; }
.home_fullbg .wrapper > div { width: 50%; }
.home_fullbg .wrapper .photo2 { padding-top: 7%; }
.home_fullbg .wrapper .photo1 > div { width: 120%; }
.home_fullbg .wrapper .photo2 > div { width: 120%; float: right; }
.link-card { position: relative; display: block; }
.naname-section { padding: 150px 0 100px; }
.naname-section .wrapper { display: flex; align-items: center; }
.naname-section .contents { width: 45%; padding-top: 100px; padding-right: 50px; position: relative; color: #fff; }
.naname-section .contents:before { content: ""; position: absolute; right: -50px; width: 125%; top: -5%; bottom: 0; margin: auto 0; height: 95%; background-color: #00AED9; transform: skewY(-10.4deg); }
.naname-section .contents * { position: relative; }
.naname-section .contents .title { font-size: 26px; font-weight: bold; letter-spacing: .11em; margin-bottom: 30px; line-height: 1.71; }
.naname-section .contents .detail { line-height: 1.71; letter-spacing: .075em; }
.naname-section .photo { width: 55%; transform: skewY(-10.4deg); overflow: hidden; padding-top: 42%; position: relative; }
.naname-section .photo .img { width: 100%; padding-top: 100%; transform: translateY(-91px) skewY(10.4deg); position: absolute; left: 0; top: 0; }


/* color */
.bg-blue { background: #00AED9; }
.bg-gray { background: #f1f1f1; }
.color-blue { color: #00AED9!important; }
.color-gray { color: #808080!important; }

/* page */
.message .message-box { z-index: 1; }
.message .message-box .message-text { width: 47%; padding: 0 60px 0 0; letter-spacing: .05em; max-width: 740px; }
.message .message-box .message-text .p-text { padding-bottom: 20px; }
.message .message-box .message-photo2 { width: 50%; position: static; }
.corporate-philosophy .info-box ul li { display: flex; line-height: 1.88; border-top: 1px solid #c9c9c9; }
.corporate-philosophy .info-box ul li:last-child { border-bottom: 1px solid #c9c9c9; }
.corporate-philosophy .info-box ul li .p-title { width: 200px; padding: 20px 30px; background: #f2f2f2; }
.corporate-philosophy .info-box ul li .p-text { width: calc(100% - 200px); padding: 20px 30px; }
.corporate-philosophy .info-box.bg::after { content: ''; position: absolute; right: -25%; width: 60%; padding-bottom: 60%; top: -28%; background: #f1f1f1; z-index: -1; transform: rotate(45deg); }
.access .access-box { padding: 90px 0 0 100px; color: #fff; }
.access .c-name { font-size: 34px; font-weight: bold; letter-spacing: .11em; margin-bottom: 35px; }
.access .add-text { line-height: 1.82; }
.joboffer-sec .joboffer-title { font-size: 34px; letter-spacing: .14em; }
.jobarea .p-title { font-size: 20px; font-weight: bold; letter-spacing: .2em; border-bottom: #E2E2E2 1.5px solid; padding-bottom: 5px; margin-bottom: 10px; }
.reqirements-sec .req-detail ul li { display: flex; border-top: #3D3D3D 1.5px solid; font-weight: 400; }
.reqirements-sec .req-detail ul li:last-child { border-bottom: #3D3D3D 1.5px solid;}
.reqirements-sec .req-detail ul li .r-title { width: 200px; 16px; padding: 25px 30px; background: #F2F2F2; font-weight: bold; }
.reqirements-sec .req-detail ul li .r-text { width: calc(100% - 200px); 16px; letter-spacing: .13em; padding: 25px 30px;}
.contactform-sec .sec-title { font-size: 16px; padding-bottom: 30px; margin-bottom: 30px; letter-spacing: .12em; text-align: center; border-bottom: #c9c9c9 1.5px solid; display: block; line-height: 1.71; }
.contactform-sec .main-office { width: 100%; text-align: center; padding-bottom: 35px; }
.contactform-sec .o-tel { font-size: 34px; font-weight: bold; letter-spacing: .1em; text-align: center; }
.contactform-sec .o-tel .s-tel { font-size: 20px; font-weight: bold; letter-spacing: .13em; text-align: center; }
.contactform-sec .o-tel .name-tel { 16px; font-weight: 400; letter-spacing: .13em; text-align: center; }
.contactform-sec .o-time { 16px; letter-spacing: .1em; text-align: center; }
.news-sec .news-box { position: relative;}
.news-sec .news-box figure img { position: absolute; top: -52%; width: 5px; height: 220px;}
.news-sec .news-box .news-title { width: 320px; margin: 0 auto; padding: 0 75px 0;}
.news-sec .news-box .news-title .d-title { margin-bottom: 35px;}
.news-sec .news-box ul { width: calc(100% - 320px); padding-top: 5px; }
.news-sec .news-box ul li a { display: flex; border-bottom: #E2E2E2 1.5px solid; padding-bottom: 20px; margin: 0 0 20px 0;}
.news-sec .news-box ul li:last-child a { border-bottom: none; margin-bottom: 0;}
.news-sec .news-box ul li .event-title { width: 300px; display: flex;}
.news-sec .news-box ul li .event-title .topic-title { height: 30px; width: 110px; text-align: center; font-size: 15px; font-weight: bold; letter-spacing: .1em; border: #196b9b 1px solid; color: #196b9b; margin-right: 35px;}
.news-sec .news-box ul li .event-title .date-title { font-size: 23px; font-weight: 500; letter-spacing: .11em; line-height: 1; padding: 3px 25px 0 0;}
.news-sec .news-box ul li .n-text { width: calc(100% - 300px); 16px; font-weight: 400; letter-spacing: .1em; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
/* #recruit .page-hero { height: 845px; } */
.addthumb-slider .child img { width: 100%; }
.addthumb-slider-nav { margin-top: 12px; }
.addthumb-slider-nav * { float: none!important; }
.addthumb-slider-nav .slick-track { width: auto!important; transform: none!important; display: flex; margin-top: -6px; margin-left: -6px; margin-right: -6px; flex-wrap: wrap; justify-content: flex-start; }
.addthumb-slider-nav .child { display: block; width: 25%!important; margin: 0; border: none; padding: 6px; opacity: .8; transition: .3s; float: none!important; cursor: pointer; position: relative; }
.addthumb-slider-nav .thumbs { padding-top: 70%; position: relative; }
.addthumb-slider-nav .thumbs:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; border: 3px solid #00AED9; opacity: 0; }
.addthumb-slider-nav .slick-active.child { opacity: 1; }
.addthumb-slider-nav .slick-active .thumbs:before { opacity: 1; }
.list-wrapper { background-color: #fff; padding: 15px 20px 20px; }
.list-wrapper ol { list-style-type: initial; padding-left: 20px; }
.list-wrapper .p-text { font-size: 14px; }

@media (max-width: 1400px) {
	body { font-size: 16px; }
	header .logo img { width: 250px; }
	header .navs1 li { font-size: 15px; margin: 0 12px; }
	header .navs2 .contacts a { font-size: 18px; }
}
@media (max-width: 767px) {
	body { min-width: 375px; font-size: 14px; letter-spacing: .075em; }
	.container-fluid { padding-left: 20px; padding-right: 20px; }
	header { height: 70px; }
	header .logo { border: none; width: 230px; }
	header .logo img { width: 200px; }
	header .menu-trg-area { display: block; }
	header .gnav { position: fixed; left: 0; top: 0; width: 100%; top: 60px; background: rgba(255,255,255,.9); height: 100%; opacity: 0; visibility: hidden; transition: .3s; display: block; }
	header .gnav.active { opacity: 1; visibility: visible; }
	header .navs1 { display: block; padding: 30px; width: 100%; }
	header .navs1 li { margin: 0 0 10px; padding-bottom: 10px; border-bottom: 1px solid rgba(0,0,0,.25); }
	header .navs2 { width: 100%; }
	header .contacts { width: calc(100% - 100px); }
	footer { padding: 60px 0; font-size: 14px; }
	footer .logo img { width: 200px; }
	footer .sns img { width: 24px; }
	footer .sns li { margin-left: 15px; }
	footer .footer-menu { display: flex; flex-wrap: wrap; margin-left: -10px; margin-right: -10px; }
	footer .footer-menu li { width: 50%; padding: 0 10px; margin-bottom: 10px; margin-right: 0; }
	footer .footer-menu a { border-bottom: 1px solid rgba(255,255,255,.25); display: block; }
	footer .btmlink { text-align: center; display: block; margin-bottom: 12px; }
	footer .copy { font-size: 11px; text-align: center; }
	main#home { padding-top: 120px; }
	main { padding-top: 70px; }
	.fvSlider { margin-top: 50px; }
	.fvSlider .child { padding: 0 10px; }
	.fvSlider .slick-dots { padding-right: 40px; bottom: -40px; }
	.fvSlider .slick-dots li { margin: 0 5px; }
	.fvSlider .slick-dots li button { width: 12px; height: 12px; }
	.home_fv .catch { position: relative; z-index: 1; margin-bottom: 0; }
	.large-title { font-size: 20px; }
	.home_about:before { width: 300%; left: -100%; }
	.home_about .photo img { width: 100%;}
	.home_about p { margin-top: 20px; }
	.service_about:before { width: 300%; left: -100%; }
	.service_about .photo { margin-left: -20px; margin-right: -20px; margin-top: 40px; }
	.service_product .photo { margin-left: -20px; margin-right: -20px; margin-top: 40px; }
	.link-button { padding: 10px 15px; max-width: 100%; }
	.section-title { padding: 10px 0 2px 40px; margin-bottom: 25px; }
	.section-title:before { width: 70px; }
	.section-title .en { font-size: 30px; }
	.section-title .jp { font-size: 16px; }
	.service-list { border-radius: 0;}
	.service-list li { width: 100%; margin-bottom: 20px; border-radius: 1.5em; overflow: hidden; }
	.service-list li:last-child { margin-bottom: 0; }
	.service-list li a:before { opacity: 1; }
	.service-list li a .contents { top: auto; bottom: 10%; padding: 0 20px 0; }
	.service-list li a .contents .large-title { margin-bottom: 10px; }
	.service-list li a .contents .arrow { width: 45px; height: 45px; top: -20px; right: 20px; }
	.service-list li a .contents .arrow:after { width: 8px; height: 8px; right: 1px; }
	.service-list li a .contents p { font-size: 12px; }
	.home_works { margin-top: 60px; }
	.home_works .wrapper { flex-wrap: wrap; }
	.home_works .titles { width: 100%; padding-right: 0; padding-top: 50px; padding-bottom: 40px; }
	.home_works .titles:before { width: 200%; right: -30px; border-radius: 0; }
	.home_works .contents { width: 100%; margin-top: 40px; }
	.home_works .contents:before { display: none; }
	.works-slider { width: 100%; }
	.works-slider .slick-slide { padding: 0 10px; }
	.works-slider .slick-next { right: -5px; width: 45px; height: 45px; }
	.works-slider .slick-next:after { width: 8px; height: 8px; right: 1px; }
	.works-slider .slick-prev { left: -5px; width: 45px; height: 45px; display: flex!important; z-index: 1; }
	.works-slider .slick-prev:after { width: 8px; height: 8px; left: 1px; }
	.works-card .text .title { font-size: 18px; margin-bottom: 15px; }
	.tags span { font-size: 12px; padding: 3px 10px; margin-right: 10px; }
	.home_recruit { margin-top: 60px; }
	.common-arrow { width: 45px; height: 45px; }
	.common-arrow:after { width: 8px; height: 8px; right: 1px; }
	.common-footer .s_logo img { height: 35px; }
	.scroll_top { width: 60px; height: 60px; }
	.scroll_top:before { height: calc(tan(60deg)* 5px / 1); width: 15px; }
	.home_news { padding: 50px 0;}
	.news-list { padding: 20px 20px 40px;}
	.news-list li a { padding: 15px 0 12px; }
	.news-list li a .name { width: 100%; padding-top: 6px; }
	.common-contact { padding: 40px 15px 50px; }
	.home_recruit_wrapper { padding: 35px 15px; }
	.home_recruit .wrapper { background-attachment: initial; }
	.home_contact .container-fluid { padding-left: 0; padding-right: 0; }
	.sec-title { display: block; text-align: center; margin-bottom: 35px; }
	.sec-title .en { font-size: 46px; margin-right: 0; text-indent: .16em; }
	.sec-title .jp { font-size: 12px; padding-bottom: 0; }
	.sec-title.right { text-align: center; }
	.sec-title.len .jp { padding-right: 0; }
	.sub-title { font-size: 18px; text-align: center; margin-bottom: 25px; }
	.common-menu li { width: 50%; }
	.common-menu li:nth-child(3n) { border-right: 1px solid #929292; }
	.common-menu li a { font-size: 14px; padding: 15px 10px 19px; }
	.common-menu li a:after { height: calc(tan(60deg)* 4px / 1); width: 4px; right: 10px; }
	.link-card { margin-bottom: 30px; }
	.link-card .contents { padding-bottom: 35px; padding-top: 15px; }
	.link-card .title { font-size: 18px; }
	.link-card .detail { margin-top: 15px; }
	.viewmore { font-size: 18px; width: 180px; padding: 7px 15px 5px; }
	.bg-card-link .title { font-size: 20px; }
	.maker .row { margin-left: -5px; margin-right: -5px; }
	.maker .row .col-4 { padding: 0 5px; }

	/* common */
	.page-hero { height: 200px; }
	.page-hero strong { font-size: 35px; }
	.page-hero span { font-size: 14px; }
	.site-title .en { font-size: 32px; }
	.site-title .jp { font-size: 12px; }
	.corporate-philosophy h3 { font-size: 22px; }
	.hero_text { padding: 20px; }
	.hero_text .top span { font-size: 18px; margin: 0 10px; }
	.hero_text .top img.icon { width: 20px; }
	.hero_text .top img { width: 20px; }
	.hero_text .bottom span { font-size: 24px; }
	.hero_text .bottom img { width: 20px; margin-right: 10px; }
	.joboffer-sec .maru-icon .offer-flow { width: 30%; }
	.cube-block .num { font-size: 16px; top: 10px; }
	.cube-block .msg { font-size: 11px; padding-top: 15px; }
	.detail-title { font-size: 20px; }

	/* page */
	.corporate-philosophy .info-box.bg::after { top: -18%; width: 100%; padding-bottom: 100%; }
	.message .message-box .message-text { padding: 0 20px 20px 20px; font-size: 14px; width: 100%; }
	.message .message-box .message-photo2 { width: 100%; }
	.access .access-box { padding: 40px 30px; }
	.access .access-box a { color: #fff!important; }
	.access .c-name { font-size: 22px; margin-bottom: 20px; }
	.corporate-philosophy .info-box ul li { flex-direction: column; border-top: none; }
	.corporate-philosophy .info-box ul li:last-child { border-bottom: none; }
	.corporate-philosophy .info-box ul li .p-title { width: 100%; }
	.corporate-philosophy .info-box ul li .p-text { width: 100%; letter-spacing: .03em; }
	.joboffer-sec .joboffer-title { font-size: 20px; }
	.withwork-sec .photos-box { flex-direction: column; }
	.withwork-sec .photos-box .box-01 { width: 100%; }
	.withwork-sec .photos-box .box { width: 100%; }
	.reqirements-sec .req-detail .detail-title { font-size: 20px; }
	.reqirements-sec .req-detail ul li { flex-direction: column; border-top: none; }
	.reqirements-sec .req-detail ul li:last-child { border-bottom: none; }
	.reqirements-sec .req-detail ul li .r-title { font-size: 14px; width: 100%; padding: 20px; }
	.reqirements-sec .req-detail ul li .r-text { width: 100%; padding: 20px; font-size: 14px; }
	.jobarea .p-title { font-size: 16px; }
	.contactform-sec .sec-title { font-size: 14px; }
	.message .message-box .message-photo img { width: auto; max-width: 100%; }
	.contactform-sec .o-tel { font-size: 22px; }
	.contactform-sec .o-tel .s-tel { 16px; }
	.contactform-sec .o-tel .name-tel { font-size: 12px; }
	.contactform-sec .o-time { font-size: 14px; }
	/* #recruit .page-hero { height: 300px; } */
	.common-footer { justify-content: center; flex-direction: column; }
	.common-footer .s_logo { width: 100%; padding-right: 0; text-align: center; }
	.common-footer .common-address { width: 310px; padding-top: 20px; }
	.common-footer .common-address .name { width: 80%; margin: 0 auto; margin-bottom: 8px; }
	.home_fullbg { padding: 40px 0 60px; }
	.service_about:before { display: none; }
	.naname-section { padding: 75px 0 40px; }
	.naname-section .container-fluid { padding-left: 0; padding-right: 0; }
	.naname-section .wrapper { flex-wrap: wrap; }
	.naname-section .contents { order: 2; width: 100%; padding-right: 20px; padding-left: 20px; padding-top: 70px; padding-bottom: 50px; }
	.naname-section .contents:before { width: 120%; right: -10%; height: 100%; top: 0; }
	.naname-section .contents .title { font-size: 18px; text-align: center; }
	.naname-section .photo { order: 1; width: 100%; z-index: 1; padding-top: 63%; }
}
@media (max-width:575px) {
	.message .message-box::after { right: -50%; }
	.joboffer-sec .maru-icon { align-items: center; flex-wrap: wrap; justify-content: center; margin-bottom: 40px; }
	.joboffer-sec .maru-icon .offer-flow { width: 30%; }
	.cube-block .num { font-size: 14px; top: 10px; }
	.cube-block .msg { font-size: 10px; padding-top: 10px; }
}

/* ContactForm7 */
.table-res-form { width: 100%; margin-top: .1rem; margin-bottom: .35rem; font-family: "fot-cezanne-pron",sans-serif; overflow: hidden; border-bottom: 1px solid #3D3D3D;}
.table-res-form th, .table-res-form td { padding: .2rem; border-top: 1.5px solid #c9c9c9;}
.table-res-form th { width: 25%; font-size: .15rem; line-height: 1.73; letter-spacing: .05em; text-align: left; padding-left: .8rem; padding-right: .1rem; position: relative; font-weight: bold; }
.table-res-form th .requied { font-size: .11rem; line-height: 2.4; display: inline-block; position: absolute; left: -0.75rem; color: #d63433; font-weight: normal; }
.table-res-form td { font-size: .15rem; line-height: 1.73; color: #000; padding-left: .45rem; position: relative; background: #fff;}
.table-res-form td .label-name { min-width: 80px; display: inline-block;}
.table-res-form td .requied { font-size: .117rem; line-height: .24rem; letter-spacing: .025em; padding-left: 15px; display: inline-block;}
.table-res-form td small.d-block { font-size: .12rem; line-height: 1.6; letter-spacing: .025em;}
.table-res-form input[type="text"], .table-res-form input[type="email"], .table-res-form input[type="tel"], .table-res-form input[type="date"], .table-res-form input[type="number"], .table-res-form textarea
{ padding: .15rem .1rem; margin-bottom: 0.5em; font-size: .15rem; width: 52%; background: #eee; border: none; margin-right: 0.15rem; }
.table-res-form .postal-code input[type="text"] { width: 35%;}
.table-res-form .inquiry-detail textarea { width: 90%;}
.table-res-form textarea { width: 90%; }
.table-res-form input[type="text"]:focus, .table-res-form input[type="number"]:focus, .table-res-form input[type="tel"]:focus, .table-res-form input[type="email"]:focus, textarea:focus { background: #EEFFFF; box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.5);}
.table-res-form input[class*="p-postal-code"] { width: 140px;}
.table-res-form span.wpcf7-not-valid-tip { font-size: 10px; display: inline-block;}
.table-res-form + p { text-align: center; max-width: 250px; margin: auto; position: relative;}
.table-res-form + p:after { content: ""; background: url("../images/common/link_arrow_w.svg")no-repeat; width: 9px; height: 11px; background-size: contain; position: absolute; right: 10px; top: 25%; margin: auto;}
span.wpcf7-list-item { margin: 0 2em 0 0!important;}
span.wpcf7-list-item.first { margin-left: 0!important;}
span.wpcf7-acceptance .wpcf7-list-item { margin-left: 0!important; margin-right: .07rem!important;}
input[type="submit"] { position: relative; display: block; width: 100%; max-width: 1.7rem; padding: .06rem 0 .035rem; text-align: center; color: #fff!important; transition: all .3s; background: #005ab9; margin: auto;}
.table-res-form p { position: relative;}
#contact_wrapper hr { border-top: 1px solid #3D3D3D; margin: 10px 0; }
#contact_wrapper .contact-border-wrap { text-align: center; margin-top: 30px; }
#contact_wrapper .contact-border-wrap > div { display: inline-block; text-align: left; }
#contact_wrapper button { border: none; color: #fff; background: #00AED9; outline: none; line-height: 1; padding: 18px; max-width: 310px; width: 100%; cursor: pointer; }
@media (max-width: 767px) {
  .table-res-form .empty { display: none;}
  .table-res-form th, .table-res-form td { width: 100%; display: block; padding: .2rem 0 .15rem; }
  .table-res-form th { text-align: left; padding-left: 0;}
  .table-res-form th .requied { padding-left: 0; position: static; margin-right: .1rem;}
  .table-res-form td { padding-left: .15rem; border: none; padding: 0; padding-bottom: .2rem;}
  .table-res-form td .label-name { width: 100%; margin-bottom: .1rem;}
  .table-res-form td span.label-name.none-md { display: none;}
  .table-res-form span.postal-code input[type="text"],
  .table-res-form span.your-name input[type="text"] { margin-bottom: 0;}
  .table-res-form input[type="text"],
  input[type="email"],
  input[type="tel"],
  .table-res-form .inquiry-detail textarea,
  .table-res-form .postal-code input[type="text"] { width: 100%;}
  .table-res-form input[type="text"], .table-res-form input[type="email"], .table-res-form input[type="tel"], .table-res-form input[type="date"], .table-res-form input[type="number"], .table-res-form textarea { width: 100%; }
}
#autozip { display: none!important; }