@charset "UTF-8";

*{
    margin: 0;
    color: #333333;
}
body {
	font-size: 16px;;
	font-family: "Noto Sans JP", sans-serif;
  	font-optical-sizing: auto;
  	font-weight: 400;
  	font-style: normal;
}
img {
    display: block;
    max-width: 100%;
    height: auto;
}
a{
    color: #3662B9;
}
a:hover{
    opacity: 0.7;
    transition: 0.3s;
    text-decoration: none;
}

/* ------------------- 汎用スタイルここから ------------------- */
.flex{
    display: flex;
}
.ai-center{
    display: flex;
    align-items: center;
}
.ai-fs{
    display: flex;
    align-items: flex-start;
}

.set-center{
    text-align: center;
}
.set-right{
    text-align: right;
}
.set-left{
    text-align: left;
}

.m-auto{
    margin: 0 auto!important;
}

.m-t0{
    margin-top: 0!important;
}

.m-b0{
    margin-bottom: 0!important;
}
.m-b5{
    margin-bottom: 5px!important;
}
.m-b10{
    margin-bottom: 10px!important;
}
.m-b20{
    margin-bottom: 20px!important;
}
.m-b30{
    margin-bottom: 30px!important;
}

.text-bold{
    font-weight: bold;
}
.text-red {
    color: #cd0000;
}
.text-blue {
    color: #0F78E1;
}

.imgborder {
    box-sizing: border-box;
    border: 1px #999 solid;
    background-color: #FFF !important;
}
.linkshadow{
    box-shadow: 0 0 12px rgb(119 119 119 / 55%);
}
.linkshadow:hover{
    box-shadow: 0 0 25px rgb(119 119 119 / 40%);
}
.pc-none{
    display: none;
}

/* レスポンシブ対応レイアウト */
.layoutpart-2-1{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
    gap: 15px 1vw;
}
.layoutpart-3-1{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 4vw;
}
@media only screen and (max-width: 768px) {
    /* レスポンシブ対応レイアウト */
    .layoutpart-2-1,
    .layoutpart-3-1{
        grid-template-columns: 1fr;
    }

    .pc-none{
    display: block;
    }
    .sp-none{
        display: none;
    }
}
/* ------------------- 汎用スタイルここまで ------------------- */



/* ------------------- ボタンスタイルここから ------------------- */
/* 四角ボタン */
.button-square {
    position: relative;
    display: inline-block;
    background: #fff;
    border-radius: 10px;
    width: auto;
    min-width: 300px;
    max-width: 400px;
    text-align: center; 
    padding: 25px 45px 25px 30px;  
    text-decoration: none;
    box-shadow: 0 0 12px rgb(119 119 119 / 55%);
    color: #333333;
    font-size: 20px;
}
.button-square:hover{
    box-shadow: 0 0 25px rgb(119 119 119 / 40%);
}
.button-square::after {
    position: absolute;
    content: "→";
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    right: 15px;
}
/* 四角ボタン-青 */
.button-square.button-blue {
    background: #0F78E1;
    color: #fff;
}
/* 四角ボタン-矢印無し */
.button-square.button-notarrow{
    padding: 25px 30px;  
}
.button-square.button-notarrow::after {
    content: "";
}

@media only screen and (max-width: 768px) {
    .button-square {
        min-width: 180px;
    }
}
/* ------------------- ボタンスタイルここまで ------------------- */


/* ------------------- ヘッダー・フッタースタイルここから ------------------- */
/* ヘッダー */
.header-wrap{
    width: 100%;
	max-width: 1800px;
  	position: fixed;
  	z-index: 999;
    left: 50%;
    right: 50%;
    transform: translateX(-50%);
}
.header {
    position: relative;
	max-width: 1800px;
	display:flex;
    justify-content: space-between;
	box-shadow: 0 0 12px rgb(119 119 119 / 55%);
  	border-radius: 10px;
  	padding:10px 30px 10px 30px;
  	margin: 15px 30px 0 30px;
  	align-items: center;
  	background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.header a {
	text-decoration:none;
}
.header-logo {
	width: 100px;
  	height: auto;
}
.header-logo-text {
	margin-left:30px
}
.header-recruit {
	line-height: 2;
  	padding: 7px 50px;
  	color: #fff;
  	background: linear-gradient(to right, #111A5F, #CD0677); /* 左→右グラデ */
  	border-radius: 10px;
  	transition: 0.3s ease;
  	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
  	display: flex;
  	align-items: center;
    justify-content: center;
}
.header-recruit img {
	max-height:20px;
	padding-left:5px;
}
.header-left {
	display:flex;
	align-items: center;
}
.header-right ul {
	padding-left:0;
}
.header-right li {
	display: inline-block;
	list-style:none;
	margin-left: 40px;
}
.header-button {
	display: inline-block;
	position: relative; /* 相対位置指定 */
}
.header-button::after {
  background-color: #6E9FBF; /* 下線の色 */
  bottom: -4px; /* 要素の下端からの距離 */
  content: ""; /* 要素に内容を追加 */
  height: 2px; /* 下線の高さ */
  left: 0; /* 要素の左端からの距離 */
  position: absolute; /* 絶対位置指定 */
  transform: scale(0, 1); /* 下線を横方向に0倍、縦方向に1倍に変形（非表示） */
  transform-origin: center top; /* 変形の原点を中央上に指定 */
  transition: transform .3s; /* 変形をアニメーション化 */
  width: 100%; /* 要素の幅 */
}
/* リンクにホバーした際の下線の表示 */
.header-button:hover::after {
  transform: scale(1, 1); /* 下線を横方向に1倍、縦方向に1倍に変形（表示） */
}

/* スライドショー */
.slider{
    padding-top: 80px;
}
.dots-wrap {
    display: flex;
    justify-content: center;
    padding-left: 0;
}
.dots-wrap li {
    width: 40px;
    height: 4px;
    margin: 0 5px;
    background: #707070;
    cursor: pointer;
    list-style: none;
    border-radius: 100px;
}
.dots-wrap li:hover,
.dots-wrap li.slick-active {
    background: #6E9FBF;
}
.dots-wrap li button {
    display: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
    padding: 0;
    border: none;
    background-color: transparent;
}
.slider-img {
	transform: scale(.8);
	transition: transform .3s;
}
.slider-img.slick-center {
	transform: scale(1);
}
.slider-img img{
    border-radius: 30px;
    box-shadow: 0 0 12px rgb(119 119 119 / 55%);
    margin: 50px auto 20px;
}
/* フッター */
footer h3 {
	font-size: 30px;
	font-weight: normal;
    position: relative;
    margin-bottom: 30px;
}
footer h3::after{
    content: "…";
    position: absolute;
    top: 30px;
    left: 0;
}
footer h4 {
	font-size: 20px;
}
footer a {
	color: #333333;
}
footer ul {
	padding:0;
}
.footer-top {
	border-radius: 50px 50px 0 0;
	background-color: #F9F9F9;
	box-shadow: 0 0 12px rgb(119 119 119 / 55%);
}
.footer-top .footer-wrap{
    max-width: 1500px;
    margin: auto;
	display:flex;
    justify-content: space-between;
    padding: 60px 50px;
}
.footer-top-left, .footer-top-right {
	width:45%;
}
.follow{
    margin-top: 30px;
 }
.follow-content {
	display:flex;
	align-items: center;
}
.follow-content-left img {
	max-height: 90px;
}
.follow-content-right {
	margin-left: 20px;
}
.follow-content div p {
	margin-bottom: 10px;
}
.sns {
	display: flex;
}
.sns a {
	margin-right: 15px;
}
.sns img {
	border-radius: 5px;
}
.footer-top-right li {
	list-style:none;
    margin-bottom: 10px;
}
.footer-top-right li a{
    text-decoration: none;
}
.menu {
	display: flex;
	margin-bottom:30px;
}
.menu-left {
	margin-right:60px;
}
.menu-left a {
	font-size: 20px;
}
.menu-left a.footer-recruit-link{
    display: flex;
    align-items: center;
}
.menu-left a.footer-recruit-link img{
    padding-left: 5px;
}
.menu-left a::before{
    content: "";
    background: #333;
    width: 10px;
    height: 2px;
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
}
.footer-top hr {
	border-left-width: 0px;
  	border-left-style: solid;
}
.footer-top .footer-top-left hr {
	border-bottom-width: 0px;
  	border-bottom-style: solid;
}
.other-site {
	width: 90%;
}
.other-site h4 {
	font-weight: normal;
	padding-left:15px
}
.other-site-content {
	background-color: #EFEFEF;
}
.other-site-content ul {
	padding: 20px 0;
	margin: -10px auto auto 15px
}
.other-site-content li {
	margin-bottom: 15px;
}

.other-site-content li:last-child {
	margin-bottom: 0;
}
.footer-bottom {
	display: flex;
	background-color: #707070;
    justify-content: space-between;
    padding: 20px 45px;
}
.footer-bottom p, .footer-bottom h4 {
	color:#F9F9F9;
}
.footer-bottom-left {
	display: flex;
	align-items: center;
}
.footer-bottom-left div {
	margin-right:20px;
}
.footer-bottom-right-content {
	display: flex;
}
.footer-bottom-right-content div {
	display: flex;
	margin: 0 0 0 auto;
}
.footer-bottom-right-content a {
	max-height: 50px;
	background-color: #F9F9F9;
	margin-left: 20px;
}
.footer-bottom-right-content img {
	max-height: 50px;
}
.footer-bottom-right .copyright{
    font-size: 0.8em;
    margin-top: 5px;
}
.footer-button{
    text-align: right;
    margin: 30px 0;
}
.footer-button .button-circle{
    position: relative;
    display: inline-block;
    background: #fff;
    border-radius: 50px;
    width: auto;
    min-width: 180px;
    max-width: 350px;
    text-align: left; 
    padding: 20px 45px 20px 30px;  
    text-decoration: none;
    box-shadow: 0 0 12px rgb(119 119 119 / 55%);
    color: #333333;
    font-size: 20px;
}
.button-circle::after {
    position: absolute;
    content: "→";
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    right: 15px;
    border: 1px solid #333;
    padding: 3px 4px 7px 7px;
    border-radius: 50%;
    width: 25px;
    height: 25px;
}
.footer-button a.button-circle:hover{
    box-shadow: 0 0 25px rgb(119 119 119 / 40%);
}

/* レスポンシブ */
@media screen and (max-width: 1300px){
    .header-right li {
        margin-left: 20px;
    }
}
@media screen and (min-width: 1201px){
    .hamburger{
        display: none;
    }
}
@media screen and (max-width: 1200px){
    .back-cover.put{
        width: 100vw;
        height: 100vh;
        position: fixed;
        z-index: 900;
        background: rgba(0, 0, 0, 0.5);
        backdrop-filter: blur(5px);
    }
    .header-button::after{
        display: none;
    }
    .header{
        z-index: 3;
    }
    .header.open{
        z-index: 3;
        background: #fff;
        transition: 0.5s;
    }
    .header-right li {
        margin-left: 0px;
        width: 100%;
    }
    .header-right li a{
        display: block;
        padding: 15px 0 15px;
    }
    .header-right li:last-child a{
        padding: 0;
        margin-top: 25px;
    }
    .header-right li:not(:last-of-type){
        border-bottom: 3px solid #CECECE;
    }
    /* ハンバーガーメニューのスタイル */
    .hamburger {
        position: absolute;
        top: 20px;
        right: 20px;
        width: 30px;
        cursor: pointer;
        z-index: 10; /* メニューより前に表示 */
    }

    .hamburger span {
        display: block;
        height: 3px;
        width: 100%;
        background-color: #333; /* ボタンの色 */
        margin: 5px 0;
        transition: 0.4s;
    }

    /* メニューのスタイル */
    .header-right {
        position: absolute;
        top: 0;
        right: 0;
        width: 100%;
        height: 100vh;
        /* background-color: rgb(0,0,0,0.8); */
        opacity: 0; /* 初期状態は透明 */
        pointer-events: none; /* クリック不可 */
        transition: opacity 0.5s ease; /* フェードインのアニメーション */
        padding: 20px 0;
        box-sizing: border-box;
        z-index: 5;
        margin-top: 90px;
    }
    .header-right ul{
        padding: 20px 30px 35px 30px;
        background: #fff;
        backdrop-filter: blur(10px);
        border-radius: 20px;
	    box-shadow: 0 0 12px rgb(119 119 119 / 55%);
    }

    /* メニューが開いたとき */
    .header-right.open {
    opacity: 1; /* 不透明にする */
    pointer-events: auto; /* クリック可能にする */
    }

    /* バツ印に変わるハンバーガーボタン */
    .hamburger.active span:nth-child(1) {
    transform: rotate(45deg) translate(5px, 5px);
    }

    .hamburger.active span:nth-child(2) {
    opacity: 0; /* 真ん中の線を透明にする */
    }

    .hamburger.active span:nth-child(3) {
    transform: rotate(-45deg) translate(6px, -6px);
    }

    .menu-right {
        margin-left: 20px;
    }
}

@media screen and (max-width: 960px){
    .slider .slick-initialized .slick-slide{
        width: 100vw;
    }
    .slider .slick-slide img{
        width: 100vw;
    }
    
    .slider-img,
    .slider-img.slick-center {
        transform: scale(.95);
    }
    .footer-top .footer-wrap{
        flex-wrap: wrap;
        padding: 0;
    }
    .footer-top-left,
    .footer-top-right{
        width: 100%;
        margin: 50px;
    }
    .footer-top .footer-top-left hr{
        margin: 10px 0;
    }
    .footer-top hr {
        margin: 40px 0 30px 0;
        border-bottom: 0px solid #333;
        width: 100%;
        margin: 10px 50px;
    }
    .footer-bottom{
        flex-wrap: wrap;
        justify-content: center;
    }
    .footer-bottom-right{
        margin: 0 auto;
    }
    .footer-bottom-left > div:nth-child(2){
        margin-right: 0;
    }
    .footer-bottom-right-content div{
        margin: 10px auto;
    }
}
@media screen and (max-width: 550px){
    .header-left{
        margin-right: 30px;
    }
    .menu{
        flex-wrap: wrap;
    }
    .footer-bottom-left{
        flex-wrap: wrap;
    }
    footer h4,
    footer p{
        margin: 20px auto;
    }
    .other-site{
        width: 100%;
    }
    .other-site h4{
        margin: 0;
    }
}
@media screen and (max-width: 360px){
    .header-left .header-logo-text b{
        font-size: 12px;
    }
    .header-logo-text {
        margin-left: 10px;
    }
}

/* ページトップに戻る */
.pagetop {
	display: none;
	position: fixed;
	bottom: 10px;
	right: 15px;
    z-index: 50;
}
.pagetop a {
	display: block;
	background-color: #333;
	text-align: center;
	color: #F6F6F6;
	font-size: 18px;
	text-decoration: none;
	padding: 5px 10px;
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}
.pagetop a:hover {
	display: block;
	background-color: #333;
	text-align: center;
	color: #F6F6F6;
	font-size: 18px;
	text-decoration: none;
	padding:5px 10px;
	filter:alpha(opacity=40);
	-moz-opacity: 0.4;
	opacity: 0.4;
	transition-duration:.5s;
}


/* ------------------- ヘッダー・フッタースタイルここまで ------------------- */

/* ------------------- トップページここから ------------------- */
#index-page .content-wrap{
    max-width: 1500px;
    margin: 50px auto;
    padding: 80px 20px 20px;
}
#index-page .content-wrap h2{
    font-size: 3em;
    font-weight: normal;
}
#index-page .content-wrap p.page-subtitle{
    font-size: 1.2em;
}
#index-page .service .content-wrap p.page-subtitle:after,
#index-page .news .content-wrap p.page-subtitle:after{
    content: "";
    background: #6E9FBF;
    width: 100px;
    height: 3px; 
    display: block;
    margin-top: 10px;
    border-radius: 50px;
}
/* aboutus */
#index-page .aboutus{
    background: #F8F8F8;
    border-radius: 50px 50px 0 0;
    position: relative;
    margin-bottom: 50px;
    overflow: hidden;
    padding-bottom: 40px;
}
#index-page .aboutus::before{
    content: "";
    background-image: url("../img/wave_01.png");
    background-repeat: no-repeat;
    width: 780px;
    height: 500px;
    position: absolute;
    top: 0;
    left: 0;
    display: block;
}
#index-page .aboutus::after{
    content: "";
    background-image: url("../img/wave_02.png");
    background-repeat: no-repeat;
    width: 1100px;
    height: 500px;
    position: absolute;
    bottom: 0;
    right: 0;
    display: block;
}
#index-page .aboutus .content-wrap{
    z-index: 30;
    position: inherit;
    max-width: 1300px;
}
#index-page .aboutus .content-wrap .text-catchcopy{
    margin: 20px 0;
    font-size: 1.5em;
    letter-spacing: 2.5px;
}
#index-page .button-area{
    margin: 50px auto;
}
#index-page .img-scroll div img{
    width: 350px;
    border-radius: 10px;
}
#index-page .img-scroll .slick-slide {
  margin-right: 25px;
}
#index-page .img-scroll{
    z-index: 1;
}
#index-page .img-scroll .aboutus-img1{
    margin-top:0;
}
#index-page .img-scroll .aboutus-img2{
    margin-top:30px;
}
#index-page .img-scroll .aboutus-img3{
    margin-top:50px;
}
#index-page .img-scroll .aboutus-img4{
    margin-top:10px;
}
#index-page .img-scroll .aboutus-img5{
    margin-top:40px
}
/* #index-page .img-scroll{
    position: relative;
    z-index: 1;
}
#index-page .img-scroll .slick-slide {
  margin-right: 25px;
  min-height: 500px;
}
#index-page .img-scroll .aboutus-img1,
#index-page .img-scroll .aboutus-img2,
#index-page .img-scroll .aboutus-img3,
#index-page .img-scroll .aboutus-img4,
#index-page .img-scroll .aboutus-img5{
    width: 350px;
    border-radius: 10px;
    position: absolute;
  margin-right: 25px;
}
#index-page .img-scroll .aboutus-img1{
    top:0;
}
#index-page .img-scroll .aboutus-img2{
    top:30px;
}
#index-page .img-scroll .aboutus-img3{
    top:50px;
}
#index-page .img-scroll .aboutus-img4{
    top:10px;
}
#index-page .img-scroll .aboutus-img5{
    top:40px
} */
/* サービス */
#index-page .service .content-wrap .service-wrap{
    display: flex;
    margin-top: 40px;
}
#index-page .service .content-wrap .left-content{
    width: 50%;
}
#index-page .service .content-wrap .right-content{
    width: 50%;
    margin-top: -100px;
}
#index-page .service .content-wrap .right-content ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    padding: 0;
}
#index-page .service .content-wrap .right-content ul li{
    list-style: none;
    width: 22%;
    margin: 15px;
}
#index-page .service .content-wrap .right-content ul li img{
    border-radius: 10px;
    box-shadow: 0 0 12px rgb(119 119 119 / 55%);
}
#index-page .service{
    position: relative;
}
#index-page .service::after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    clip-path: polygon(0 89%, 100% 15%, 100% 100%, 0% 100%);
    background: #F9F9F9;
    z-index: -99;
}
@media screen and (max-width: 960px){
    #index-page .service .content-wrap .service-wrap{
        flex-wrap: wrap;
    }
    #index-page .service .content-wrap .left-content,
    #index-page .service .content-wrap .right-content{
        width: 100%;
    }
    #index-page .service .content-wrap .right-content{
        margin-top: 30px;
    }
}

/* お知らせ・トピックス */
.news ul {
	padding:0;
    margin-top: 30px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 3%;
}
.topics>div{
    width: 100%;
	border-radius: 15px;
    border: solid 1px rgb(119 119 119 / 50%);
}
.topics>a{
    width: 100%;
	border-radius: 15px;
    box-shadow: 0 0 12px rgb(119 119 119 / 55%);
}
.topics>a:hover {
    box-shadow: 0 0 25px rgb(119 119 119 / 40%);
}
.topics .topics-inner {
	text-decoration: none;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    gap: 20px 0;
}
.topics .topics-inner img {
	border-radius: 15px 15px 0 0;
    width: 100%;
    height: 220px;
    object-fit: cover;
}
.topics .topics-inner img.position-ue {
    object-position: top;
}
.topics .date-category{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 30px;
    padding: 0 20px;
}
.topics .date-category span {
	color: #fff;
  	border-radius: 10px;
    width: 9.2em;
  	padding: 5px 0;
  	display: inline-block;
    text-align: center;
}
.topics.topics-news span{
	background-color: #659D6C;
}
.topics.topics-release span{
	background-color: #CCA259;
}
.topics.topics-recruit span{
	background-color: #D66C98;
}
.topics .date-category .date {
    color: #777777;
}
.topics .text {
	padding: 0 20px 20px 20px;
    min-height: 8em;
}
@media screen and (max-width: 1200px) {
    #index-page .news .content-wrap ul {
        grid-template-columns: 1fr 1fr;
        width: fit-content;
        margin: 30px auto 0;
    } 
    .topics {
        max-width: 440px;
    }
    .topics .text {
        min-height: 6em;
    }
}
@media screen and (max-width: 960px) {
    .topics .topics-inner {
        gap: 15px 0;
    }
}
@media only screen and (max-width: 768px) { 
    #index-page .content-wrap{
        margin: 0 auto;
        padding-top: 50px;
    }
    .news ul {
        gap: 20px;
    } 
    .topics .topics-inner img {
        height: 180px;
    }
}
@media only screen and (max-width: 450px) { 
    .topics .topics-inner {
        gap: 10px 0;
    }
    .topics .topics-inner img {
        height: 130px;
    }
    .topics .date-category{
        padding: 0 15px;
    }
    .topics .date-category span {
        width: auto;
        padding: 5px 20px;
        font-size: 0.8em;
    }
    .topics.topics-recruit span{
        padding: 5px 10px;
}
    .topics .text {
        padding: 0 15px 25px 15px;
        min-height: auto;
    }
}

/* 採用情報 */
#index-page .recruit {
    margin: 20px;
}
#index-page .recruit .content-wrap{
    background: #FFE9F3;
    border-radius: 30px;
    box-shadow: 0 0 12px rgb(119 119 119 / 55%);
    margin: 100px auto;
    padding: 0;
    position: relative;
}

#index-page .recruit .content-wrap a{
    text-decoration: none;
    display: flex;
}
#index-page .recruit .content-wrap .copy{
    margin: 20px 0;
    font-size: 1.5em;
    letter-spacing: 2px;
    font-weight: bold;
}
#index-page .recruit .content-wrap::before{
    content: "";
  width: 6px;
  height: 350px;
  display: block;
  background: #CD0677;
  position: absolute;
  left: 30px;
  top: 0;
}
#index-page .recruit .content-wrap .left-content{
    margin: 50px 50px 50px 80px;
    position: relative;
}
#index-page .recruit .content-wrap .left-content h2,
#index-page .recruit .content-wrap .left-content p{
    position: inherit;
    z-index: 1;
    background: rgb(255 233 243 / 80%);
}
#index-page .recruit .content-wrap .left-content::after{
    content: "";
    background-image: url("../img/recruit_illust.png");
    background-repeat: no-repeat;
    width: 380px;
    height: 243px;
    display: block;
    position: absolute;
    bottom: -30px;
    right: 0px;
}
#index-page .recruit .content-wrap .right-content img{
    border-radius: 0 30px 30px 0;
    object-fit: cover;
    height: 575px;
}
@media only screen and (max-width: 990px) {
    #index-page .recruit .content-wrap .left-content::after{
        width: 90%;
        right: 0;
        height: 90%;
        background-size: contain;
        bottom: -270px;
    }
}
@media only screen and (max-width: 768px) {
    #index-page .recruit .content-wrap{
        margin: 0 auto;
    }
    #index-page .recruit .content-wrap .right-content img{
        display: none;
    }
    #index-page .recruit .content-wrap .left-content{
        min-height: 400px;
    }
    #index-page .recruit .content-wrap .left-content::after{
        width: 70%;
        right: 0;
        height: 60%;
        background-size: contain;
        bottom: -35px;
    }
}
@media only screen and (max-width: 620px) {
    #index-page .recruit .content-wrap .left-content::after{
        bottom: -65px;
    }
}
@media only screen and (max-width: 570px) {
    #index-page .recruit .content-wrap .left-content::after{
        bottom: -90px;
    }
}
@media only screen and (max-width: 500px) {
    #index-page .recruit .content-wrap .left-content::after{
        bottom: -160px;
    }
    #index-page .recruit .content-wrap .left-content {
        min-height: 500px;
    }
}
@media only screen and (max-width: 450px) {
     #index-page .recruit .content-wrap .left-content::after {
        bottom: -190px;
        width: 80%;
        left: 40px;
    }
}
@media only screen and (max-width: 340px) {
     #index-page .recruit .content-wrap .left-content::after {
        bottom: -250px;
    }
}
/* お問い合わせ */
#index-page .contact{
    background: #F9F9F9;
    margin: 80px 0;
    position: relative;
    overflow: hidden;
}
#index-page .contact::before{
    content: "";
    background-image: url("../img/wave_03.png");
    background-repeat: no-repeat;
    width: 100vw;
    height: 100vh;
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    bottom: 0;
}
#index-page .contact .content-wrap{
    display: flex;
    max-width: 1500px;
    justify-content: space-between;
    padding-bottom: 80px;
    padding: 40px;
}
#index-page .contact .content-wrap .contact-text{
    margin-top: 50px;
} 
@media only screen and (max-width: 768px) {
    #index-page .contact .content-wrap{
        flex-wrap: wrap;
    }
    #index-page .contact .content-wrap .right-content{
        margin: 0 auto;
    }
}
/* バナー */
#index-page .banner .content-wrap{
    justify-content: space-around;
}
#index-page .banner .content-wrap img{
    margin: 10px;
    border: 1px solid #aaa;
}
@media only screen and (max-width: 1200px) {
    #index-page .banner .content-wrap img{
        width: 80%;
        margin: auto;
    }
}
@media only screen and (max-width: 768px) {
    #index-page .banner .content-wrap{
        flex-wrap: wrap;
        padding-top: 0;
    }
    #index-page .banner .content-wrap img{
        width: 100%;
        margin: 10px 0;
    }
}

/* ------------------- トップページここまで ------------------- */



/* ------------------- 詳細ページ共通スタイルここから ------------------- */
.content-outer{
    padding: 0 20px;
}
.content{
    max-width: 1500px;
    margin: 0 auto;
}


/* 詳細ページ上部 */
#subpage-top{
    background-color: #F8F8F8;
    padding-top: 200px;
    padding-bottom: 70px;
    position: relative;
}

#subpage-top.content-outer::after{
    content: "";
    position: absolute;
    background-image: url(../img/company/main-image-company.png);
    height: calc(100% - 110px);
    width: 100%;
    max-width: 1343px;
    right: 0;
    bottom: 0;
    background-size: auto;
    background-position: right bottom;
    background-repeat: no-repeat;
}

#subpage-top .main-image{
    position: absolute;
    right: 0;
    bottom: 0;
    height: calc(100% - 110px);
}

#subpage-top .page-title{
    position: relative;
    font-size: 50px;
    font-weight: normal;
    margin: 0;
    z-index: 10;
    overflow-wrap: break-word;
}
#subpage-top .page-subtitle{
    position: relative;
    font-size: 20px;
    margin: 0;
    z-index: 10;
}
#subpage-top .page-title::before{
    content: '';
    background-color: #6E9FBF;
    width: 38px;
    height: 3px;
    position: absolute;
    top: -20px;
}

/* パンくず */
#pankuzu{
    background: #EFEFEF;
}
#pankuzu>div{
    display: flex;
    flex-wrap: wrap;
    gap: 5px 0;
    padding: 15px 0;
}
#pankuzu p{
    font-size: 16px;
    color: #333333;
    position: relative;
    padding-right: 18px;
}
#pankuzu p::after{
    content: '';
    width: 6px;
    height: 6px;
    border-left: 1px solid #333333;
    border-bottom: 1px solid #333;
    transform: rotate(225deg);
    transform-origin: 25% 65%;
    transition: all .5s;
    position: absolute;
    bottom: 0.45em;
    right: 0.2em;
    margin: auto;
}
#pankuzu p:last-child::after{
    content: none;
}

/* サイドバー */
.content-sidebar {
    display: flex;
}
.content-sidebar .main-content {
    flex: 1;
}

.sidebar {
    width: 230px;
    padding: 80px 50px 0 5px;
    position: sticky;
    top: 0;
    height: calc(100vh - 30px);
    overflow-y: auto;
}
.sidebar ul {
    list-style: none;
    padding: 0;
    margin: 0;
    position: relative;
    border-left: 1px solid #A0A0A0;
}
.sidebar li {
    margin: 30px 0;
    position: relative;
    padding-left: 20px;
}
.sidebar li ul li {
    margin: 10px 0;
}
.sidebar>ul>li::before {
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 50%;
    position: absolute;
    left: -5px;
    top: 15px;
    transform: translateY(-50%);
}
.sidebar>ul>li.active::before {
    background: #6E9FBF;
}
.sidebar li ul {
    margin-top: 5px;
    border: none;
}
.sidebar li ul li::before {
    content: none;
}
.sidebar a {
    text-decoration: none;
    color: #666;
    font-size: 20px;
}
.sidebar>ul>li.active>a {
    color: #333333;
    font-weight: bold;
}
.sidebar li ul li.active>a {
    color: #333333;
    font-weight: bold;
}
.sidebar li ul li a {
    font-size: 18px;
}

@media screen and (max-width: 1200px) {
    .content-sidebar {
        display: block;
    }
    .sidebar{
        width: auto;
        position:static;
        height:auto;
        padding: 0;
        margin: 0;
        margin-bottom: 20px;
    }
    .sidebar a {
    display: block;
    padding: 20px 50px 20px 25px;
    color: #333333;
    width: 100%;
    }
    .sidebar ul{
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
        gap: 0 40px;
        border: none;
    }
    .sidebar > ul > li::before {
        content: none;
    }
    .sidebar li{
        position: relative;
        border-bottom: 3px solid #6E9FBF;
        padding: 0;
        margin: 0;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .sidebar>ul>li::before {
        left: auto;
        transform: none;
    }
    .sidebar>ul>li::after {
        content: '↓';
        padding-right: 22px;
        font-size: 18px;
    }

    .sidebar li ul{
        margin: 0;
    }
    .sidebar li ul li{
        display: none;
    }

    .sidebar > ul > li.active > a,.sidebar li ul li.active > a{
        font-weight: normal;
    }
}
@media screen and (max-width: 960px) {
    .sidebar ul {
        grid-template-columns: 1fr;
    }
    .sidebar a{
        font-size: 18px;
        padding: 20px 50px 20px 15px;
    }
}
/* ------------------- 詳細ページ共通スタイルここまで ------------------- */



/* ------------------- 詳細ページ共通スタイル―コンテンツここから ------------------- */
.content .main-content>section {
    margin-bottom: 100px;
}
.main-content section:first-child{
    margin-top: 100px;
}
.content .main-content>section:last-child {
    margin-bottom: 180px;
}
.content .main-content .inner-section {
    margin-bottom: 60px;
}
.content .main-content section>p{
    margin-bottom: 20px;
}
.main-content>section,
.main-content .subnavi{
  scroll-margin-top: 110px;
}
@media screen and (max-width: 1200px) {
    .main-content section:first-child{
        margin-top: 70px;
    }
}

/* 見出し */
.main-content h2 {
    font-size: 25px;
    font-weight: normal;
    border-bottom: solid 3px #CECECE;
    position: relative;
    padding-bottom: 17px;
    margin: 60px 0 35px 0;
}
.main-content h2:after {
    position: absolute;
    content: " ";
    display: block;
    border-bottom: solid 3px #6E9FBF;
    bottom: -3px;
    width: 64px;
}

.main-content h3 {
    position: relative;
    padding-left: 15px;
    font-size: 20px;
    font-weight: bold;
    margin: 15px 0;
}
.main-content h3::before {
    content: "";
    position: absolute;
    left: 0;
    top: -2px;
    bottom: -2px;
    width: 3px;
    background-color: #6E9FBF;
    border-radius: 6px;
}

.main-content h4 {
    display: inline-block;
    font-size: 18px;
    margin: 0 0 10px 0;
    padding: 0 2px 2px 2px;
    border-bottom: solid 1px #6E9FBF;
    width: fit-content;
}

.main-content h5 {
    font-size: 17px;
    margin: 0 0 10px 0;
}
.main-content h5::before {
    content: "■ ";
    color: #6E9FBF;
    margin-right: 3px;
}

.main-content h6 {
    font-size: 17px;
    margin: 0 0 10px 0;
}

/* リストスタイル */
.main-content ul{
    padding: 0 0 0 1em;
    margin-bottom: 20px;
}
.main-content ol{
    padding: 0 0 0 1.35em;
}
.main-content ul li::marker{
    content: "・";
}
.main-content ul li ul{
    margin-bottom: 0;
}

/* チェックマークのリスト */
.main-content .list-check li::marker{
    content: "";
}
.main-content .list-check li {
  position: relative;
  list-style: none;
}
.main-content .list-check li::after {
  content: '';
  display: block;
  position: absolute;
  top: .5em;
  left: -1.3em;
  width: 10px;
  height: 5px;
  border-left: 2px solid #6E9FBF;
  border-bottom: 2px solid #6E9FBF;
  transform: rotate(-45deg);
}

/* テーブル */
table{
    border-collapse:  collapse;
}
table th {
    background: #F9F9F9;
}
table td {
    background: #fff;
}

.table-design1 {
  margin: 20px auto;
  width: 100%;
}
.table-design1 th,.table-design1 td{
    border: solid 1px #707070;
    border-right: none;
    border-left: none;
    padding: 30px 40px;
}
.table-design1 th {
    width: 150px;
    text-align: left;
    align-content: start;
}
.table-design1 ul{
    padding: 0 1em;
}
.table-design1 li::marker{
    content: "・";
}
@media screen and (max-width: 960px) {
  .table-design1 th,
  .table-design1 td {
    border-bottom: none;
    display: inline-block;
    width: calc(100% - 40px);
    padding: 30px 20px;
  }
  .last td:last-child {
    border-bottom: solid 1px #707070;
  }
}

.table-design2 {
  margin: 20px auto;
  width: 100%;
  table-layout: auto;
}
.table-design2 th,.table-design2 td{
    border: solid 1px #707070;
    border-right: none;
    border-left: none;
    padding: 15px;
    text-align: left;
    font-size: 0.9em;
}
.table-design2 th:nth-child(2),.table-design2 td:nth-child(2){
    min-width: 120px;
}

/* カードレイアウト */
.cardlayout-1{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 4vw;
    padding: 6px;
}
.cardlayout-1>div{
    border-radius: 30px;
    box-shadow: 0 0 12px rgb(119 119 119 / 55%);
}
.cardlayout-1>div:hover{
    border-radius: 30px;
    opacity: 0.7;
    box-shadow: 0 0 25px rgb(119 119 119 / 40%);
    transition: 0.3s;
}
.cardlayout-1 .card-img{
    border-radius: 30px 30px 0 0;
    background: #F9F9F9;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cardlayout-1 .card-text{
    padding: 20px 35px 35px 35px;
}
.cardlayout-1 .card-title{
    text-align: center;
    margin-bottom: 15px;
}
.cardlayout-1 .card-title p{
    font-size: 20px;
    font-weight: bold;
    display: inline-block;
    padding: 0 2px;
}
.cardlayout-1 a{
    text-decoration: none;
}
@media only screen and (max-width: 768px) {
    .cardlayout-1{
        grid-template-columns: 1fr;
    }
    .cardlayout-1 a{
        display: flex;
    }
    .cardlayout-1 .card-img{
        border-radius: 30px 0 0 30px;
    }
    .cardlayout-1 .card-text {
        padding: 20px 35px 25px;
    }
}

/* 青の背景色が付いた箱のレイアウト */
.main-content .section-blue-box{
    margin-bottom: 60px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.main-content .section-blue-box>div{
    border-radius: 10px;
    background: #dfedf6;
    padding: 20px;
}
.main-content .section-blue-box h3{
    margin-top: 5px;
}

/* QAのレイアウト */
dl.qanda{
	width:100%;
	overflow: hidden;
}
dl.qanda dd,
dl.qanda dt{
	/* text-indent: -37px;
	padding-right: 10px;
    padding-left: 48px; */
    display: flex;
}
dl.qanda dt{
	margin-top: 20px;
}
dl.qanda dt:first-child{
    margin-top: 0;
}
dl.qanda dt>span,
dl.qanda dd>span{
	font-size: 1.75em;
	font-weight: bold;
	margin: 0 20px 0 10px;
    line-height: 1;
    min-width: 1em;
    text-align: center;
}
dl.qanda dt>p,
dl.qanda dd>p{
	margin-top: 0.2em;
    padding-right: 10px;
}
dl.qanda dd{
	margin: 32px 0 0 0;
	padding-bottom:20px;
	border-bottom: 1px #CECECE dotted;
}
dl.qanda dt>span:first-child{
	color: #0F78E1;
}
dl.qanda dd>span{
	color: #e14194;
}

/* サムネと見出しのリンク */
.main-content .portfolio-link {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 2vw;
}
.main-content .portfolio-link img{
    width: 100%;
    border: 1px #999 solid;
}
@media only screen and (max-width: 768px) {
    .main-content .portfolio-link {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
        gap: 15px;
    }
}


/* 関連リンク */
#related .link-list{
    display: flex;
    flex-wrap: wrap;
    gap: 40px 30px;
}
#related>div>div{
    display: flex;
    flex-direction: column;
}
#related .link-list-img{
    flex-grow: 1;
    margin-bottom: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
}
#related .link-list img{
    max-width: 400px;
}

/* スクロールヒント */
.main-content .scroll-hint-icon{
    top: 100px!important;
}

/* リンク前矢印>>アイコン */
.main-content .text-link a::before{
    content: "";
    display: inline-block;
    width: 11px;
    height: 11px;
    background-image: url(../img/ico_arrow_double.gif);
    background-size: contain;
    background-repeat: no-repeat;
    margin-right: 5px;
}

/* PDFアイコン */
.main-content .pdf_data::before {
    content: "";
    display: inline-block;
    width: 25px;
    height: 25px;
    background-image: url(../img/pdf_icon.png);
    background-size: contain;
    background-repeat: no-repeat;
    transform: translateY(0.3em);
}

/* リンクリスト */
.main-content .link-list{
    padding: 0;
    margin: 0;
}
.main-content .link-list li{
    margin-bottom: 5px;
    list-style: none;
}
.main-content ul.link-list li::marker {
    content: "";
}
.main-content .link-list li:last-child{
    margin-bottom: none;
}

/* 写真リスト */
/* PC3・4列→SP2列 */
.main-content .img-list{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
}
.main-content .img-list img{
    width: auto;
    height: 194px;
}
@media only screen and (max-width: 768px) {
    .main-content .img-list img{
        width: calc(50% - 5px);
        height: auto;
    }
}

/* ------------------- 詳細ページ共通スタイル―コンテンツここまで ------------------- */



/* ------------------- 会社概要ページここから ------------------- */
/* ご挨拶 */
#company-page #greeting img{
    max-width: 180px;
}
#company-page #greeting .ai-fs{
    gap: 20px 2vw;
}
#company-page #greeting .greeting-text{
    width: 100%;
    max-width: 1030px;
}

/* 企業理念 */
#company-page .management-card .card-img{
    padding: 20px;
}
#company-page .management-card .card-img img{
    display: block;
    max-width: 250px;
    height: 100%;
    object-fit: contain;
}
#company-page .card-sociability .card-title p{
    border-bottom: 1px solid #659D6C;
}
#company-page .card-scientificity .card-title p{
    border-bottom: 1px solid #CCA259;
}
#company-page .card-humanity .card-title p{
    border-bottom: 1px solid #6E9FBF;
}

/* 会社のビジョン */
#company-page .company-vision{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 5px;
}
#company-page .company-vision>div{
    padding: 10px 20px;
    display: table-cell;
    color: #fff;
    font-size: 130%;
    font-weight: bold;
}
#company-page .company-vision-item1{
    background: #ED97A9;
}
#company-page .company-vision-item2{
    background: #E9B71D;
}
#company-page .company-vision-item3{
    background: #9DC63C;
}

/* アクセスマップ */
#company-page #access .googlemap{
    width: 800px;
    max-width: 100%;
}

@media only screen and (max-width: 768px) {
    /* ご挨拶 */
    #company-page #greeting .ai-fs{
        flex-direction: column;
    }
    #company-page #greeting .greeting-text{
        order: 2;
    }
    #company-page #greeting img{
        order: 1;
        margin: 0 auto;
    }
    /* 企業理念 */
    #company-page .management-card .card-img{
        padding: 10px;
    }
    #company-page .management-card .card-img img{
        width: 20vw;
    }
    /* 会社組織図 */
    #company-page .button-sp-center{
        text-align: center;
    }
}
/* ------------------- 会社概要ページここまで ------------------- */



/* ------------------- 経営理念ページここから ------------------- */
/* ご挨拶 */
#philosophy-page .cardlayout-1 {
    gap: 25px 30px;
    margin-top: 25px;
}
#philosophy-page .cardlayout-1 a {
    display: flex;
    align-items: center;
}
#philosophy-page .cardlayout-1>div {
    border-radius: 10px;
}
#philosophy-page .management-card .card-img{
    padding: 10px;
    border-radius: 10px 0 0 10px;
}
#philosophy-page .management-card .card-img img{
    width: 100px;
}
#philosophy-page .cardlayout-1 .card-title {
    margin-bottom: 0;
    padding: 0 45px 0 20px;
    text-align: left;
}
#philosophy-page .cardlayout-1 .card-text{
    position: relative;
    width: 100%;
    padding: 0;
}
#philosophy-page .cardlayout-1 .card-text p{
    font-weight: normal;
}
#philosophy-page .cardlayout-1 .card-text::after {
    position: absolute;
    content: "↓";
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    right: 20px;
}

/* 社会性 */
#philosophy-page .main-content .section-blue-box{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(370px, 1fr));
}
#philosophy-page .main-content .section-blue-box>div{
    display: flex;
    flex-direction: column;
}
#philosophy-page .main-content .section-blue-box .article-inner{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex: 1;
}
#philosophy-page .activity-examples{
    display: flex;
    gap: 5px;
    margin: 5px 0 15px 0;
}
#philosophy-page .activity-examples img{
    width: calc(50% - 2.5px);
    height: 150px;
    object-fit: cover;
}
#philosophy-page .initiative-list li{
    margin-bottom: 10px;
}
#philosophy-page .initiative-list li::first-line{
    font-weight: bold;
}
#philosophy-page .sdgs-list{
    background-color: #fbfdff;
    border-radius: 5px;
    padding: 15px;
}
#philosophy-page .sdgs-list .sdgs-div{
    display: flex;
    gap: 5px;
}
#philosophy-page .sdgs-list img{
    width: 78px;
}

#philosophy-page #humanity .section-blue-box{
    grid-template-rows: repeat(2, 1fr);
}
#philosophy-page .tayou{
    grid-column: span 2 / span 2;
}
#philosophy-page .tayou .activity-examples img{
    width: calc(100% / 3 - 5px);
}

@media only screen and (max-width: 768px) {
    /* 社会性 */
    #philosophy-page .main-content .section-blue-box{
        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }

    /* 人間性 */
    #philosophy-page #humanity .section-blue-box{
        grid-template-rows: auto
    }
    #philosophy-page .tayou{
        grid-column: auto;
    }
}
/* ------------------- 経営理念ページここまで ------------------- */


/* ------------------- 会社説明会ページここから ------------------- */
/* 会社説明会のプログラム */
#briefing-page .program-heading{
    padding-left: 28px;
}
#briefing-page .program-heading::before{
    content: "";
    display: block;
    width: 28px;
    height: 24px;
    background-color: transparent;
    background-size: contain;
    background-repeat: no-repeat;
    top: auto;
}
#briefing-page .program-heading-about::before{
    background-image: url(../img/briefing/program-heading-about.png);
    top: 2px;
    left: 2px;
}
#briefing-page .program-heading-movie::before{
    background-image: url(../img/briefing/program-heading-movie.png);
    bottom: 1px;
}
#briefing-page .program-heading-faq::before{
    background-image: url(../img/briefing/program-heading-faq.png);
    bottom: 2px;
}
#briefing-page .briefing-fukidasi{
   position: relative;
    display: inline-block;
    margin-left: 20px;
    padding: 20px;
    min-width: 120px;
    max-width: 80%;
    border: solid 2px #707070;
    box-sizing: border-box;
}
#briefing-page .briefing-fukidasi:before {
    content: "";
    position: absolute;
    top: 50%;
    left: -24px;
    margin-top: -13px;
    border: 13px solid transparent;
    border-right: 13px solid #FFF;
    z-index: 2;
}
#briefing-page .briefing-fukidasi:after {
    content: "";
    position: absolute;
    top: 50%;
    left: -28px;
    margin-top: -14px;
    border: 14px solid transparent;
    border-right: 14px solid #707070;
    z-index: 1;
}

/* 先輩社員からのメッセージ */
#briefing-page .message-article{
    gap: 20px;
}
#briefing-page .message-article>div{
    flex-grow: 1;
}
#briefing-page #message img{
    min-width: 122px;
}
#briefing-page .message-info{
    display: inline-block;
}
#briefing-page .message-info p{
    font-size: 14px;
}
#briefing-page .message-name{
    display: block;
    padding: 0 2px 2px 2px;
    border-bottom: solid 1px #6E9FBF;
}
#briefing-page .message-name span{
    font-size: 18px;
    margin-left: 0.5em;
    font-weight: bold;
}
#briefing-page .message-university{
    padding: 2px 2px 0 2px;
}
@media only screen and (max-width: 768px) {
    /* 先輩社員からのメッセージ */
    #briefing-page .message-article{
        flex-direction: column;
    }
    #briefing-page .message-article>div{
        text-align: center;
    }
}
/* ------------------- 会社説明会ページここまで ------------------- */



/* ------------------- サービス・実績ページここから ------------------- */
/* サービス */
#department-page .service-content h4{
    margin-bottom: 15px;
}
#department-page .service-content{
    display: flex;
    gap: 15px;
}
#department-page .service-text{
    width: 70%;
}
#department-page .service-detail{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
    gap: 10px;
    margin-bottom: 15px;
}
#department-page .service-detail dl{
    display: flex;
    gap: 10px;
}
#department-page .service-detail dt{
    color: white;
    background-color: #6E9FBF;
    font-size: 14px;
    padding: 5px 10px;
    height: fit-content;
    min-width: 80px;
    text-align: center;
    border-radius: 70px;
}
#department-page .service-img{
    width: 30%;
    display: flex;
    align-content: flex-start;
    gap: 5px;
}
#department-page .service-img a{
    width: calc(50% - 5px);
}
#department-page .service-img img{
    width: 100%;
}
#department-page .service-img-layout2{
    flex-wrap: wrap;
}
#department-page .service-img-layout2 a:first-child{
    width: 100%;
}
#department-page .service-img-layout2 a:first-child img{
    width: 100%;
    object-fit: cover;
    object-position: top
}
#department-page .service-img-layout2 a:nth-child(n+2){
    width: calc(50% - 2.5px);
}
#department-page .service-img-layout2-3 a:nth-child(n+2){
    width: calc(33% - 2.5px);
}

#department-page .service-img-layout2 a:nth-child(n+2) img{
    width: 100%;
    height: 75px;
    object-fit: cover;
}
#department-page .service-img-layout2 a:nth-child(n+2) img{
    width: 100%;
    height: 75px;
    object-fit: cover;
}

#department-page .service-img-layout3{
    display: grid;
}
#department-page .service-img-layout3 a{
    width: 100%;
}

#department-page .service-link{
    display: grid;
    gap: 5px;
}

@media screen and (max-width: 960px){
    /* サービス */
    #department-page .service-content{
        flex-direction: column;
    }
    #department-page .service-text{
        width: 100%;
    }
    #department-page .service-img {
        width: 100%;
    }
    #department-page .service-img-layout2 a:first-child,
    #department-page .service-img-layout2-3 a:nth-child(n+2){
        width: calc(50% - 2.5px);
    }
    #department-page .service-img-layout2 a:first-child img{
        height: 193px;
    }
    #department-page .service-img-layout2 a:nth-child(n+2) img{
        height: 193px;
    }
    #department-page .service-img-layout3{
        display: flex;
    }
    #department-page .service-img-layout4{
        max-width: 400px;
    }
}

@media only screen and (max-width: 768px) {
    /* サービス */
        #department-page .service-detail{
        grid-template-columns: 1fr;
    }
}

/* ------------------- サービス・実績ページここまで ------------------- */



/* ------------------- 事業部紹介ここから ------------------- */
#service-page .achievements>div{
    border-radius: 10px;
    background: #dfedf6;
    padding: 20px;
    display: flex;
    flex-direction: column;
}
#service-page .achievements>div>div{
    flex-grow: 1;
}
#service-page .achievements .text-link{
    margin-top: auto;
}
/* ------------------- 事業部紹介ここまで ------------------- */



/* ------------------- お知らせ／トピックスここから ------------------- */
#topics-page .news ul{
    padding: 0;
    margin-bottom: 0;
    grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
    gap: 30px 3%;
    list-style: none;
}
#topics-page .news ul li::marker {
    content: "";
}
@media screen and (max-width: 1200px) {
    #topics-page .topics {
        max-width: none;
    }
}
@media screen and (max-width: 768px) {
    #topics-page .news ul{
        grid-template-columns: 1fr 1fr;
    }
}
/* ------------------- お知らせ／トピックスここまで ------------------- */



/* ------------------- サイトマップここから ------------------- */
#sitemap-page .link-list li {
    margin-left: 1em;
}
#sitemap-page .link-list li::marker{
    content: "・";
}
/* ------------------- サイトマップここまで ------------------- */


/* ------------------- 会社の方針・宣言ページここから ------------------- */
.main-content .personal-ol{
    padding: 0 0 0 1.5em;
    margin: 0 0 20px 0;
}
.main-content .personal-ol>li{
    margin-bottom: 20px;
}
.main-content .personal-ol>li:last-child{
    margin-bottom: 0;
}
.main-content .personal-ol>li ul{
    margin-top: 5px;
}

.main-content .personal-right{
    display: block;
    width: fit-content;
    margin: 0 0 0 auto;
}

/* 女性活躍推進に向けた取組方針 */
#josei-page .nintei-box{
    width: 100%;
    gap: 20px;
}

@media only screen and (max-width: 768px) {
    /* 女性活躍推進に向けた取組方針/ */
    #josei-page .nintei-box{
        flex-wrap: wrap;
        justify-content: center;
    }
}
/* ------------------- 会社の方針・宣言ページここまで ------------------- */



/* ------------------- お問い合わせページここから ------------------- */
#form-wrapper .main-content .content-wrap .table-design1 ul.liststyle-none li{
    margin-bottom: 5px;
}
#form-wrapper .main-content .content-wrap .table-design1 ul.liststyle-none li:last-child{
    margin-bottom: 0;
}
#form-wrapper .main-content .content-wrap .table-design1 ul.liststyle-none li::marker{
    content: "";
}
#form-wrapper .main-content .content-wrap label{
    padding-left: 5px;
}
#form-wrapper .main-content .content-wrap .ex-text{
    width: 100%;
}
#form-wrapper .main-content .content-wrap textarea{
    width: 100%;
}
#form-wrapper .main-content .content-wrap .table-design1 ul.liststyle-none{
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}
#form-wrapper .main-content .content-wrap .personal-area{
    background-color: #dfedf6;
    margin: 20px 0;
    padding: 20px;
    text-align: center;
}
#form-wrapper .main-content .content-wrap .box-contact-tell{
    background: #EFEFEF;
    padding: 30px;
}
#form-wrapper .main-content .content-wrap .box-contact-tell .text-tellnumber img{
    display: inline-block;
}
#form-wrapper .main-content .content-wrap .box-contact-tell .text-tellnumber{
    font-size: 1.5em;
}

#form-wrapper .main-content .content-wrap .box-error{
    border: 1px solid #cd0000;
    color: #cd0000;
    margin: 10px 0;
    padding: 15px 20px;
}
#form-wrapper .main-content .content-wrap .form-error{
    margin: 0 0 10px 0;
    padding: 0 1em 0 0;
    color: #cd0000;
}

@media screen and (min-width: 961px) {
    #form-wrapper .content-wrap .table-design1 th{
        width: 210px;
    }
}
@media only screen and (max-width: 768px) {
    #form-wrapper .main-content .content-wrap .input-text{
        width: 100%;
    }
}
/* ------------------- お問い合わせページここまで ------------------- */