/*
Theme Name: nakagawa Theme
*/

/*=========================================*/
/* All */
/*=========================================*/

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@100;300;400;500;700;900&display=swap');

/*-- reset --*/

html, body, div, span, object,
h1, h2, h3, h4, h5, h6,
p, img, dl, dt, dd,
ol, ul, li,
fieldset, form, label, table, caption,
tbody, tfoot, thead,
article, aside, footer, header, menu, nav, section,
audio, video{
	margin:0;
	padding:0;
	border:0;
	outline:0;
	vertical-align:baseline;
	background:transparent;
}

.clearfix {zoom:1;}
.clearfix:after{content: "";display: block;clear: both;}
.clear{clear:both;}

ol, ul{
	list-style:none;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section{
	display:block;
}

blockquote, q{
	quotes:none;
}

blockquote:before,
blockquote:after,
q:before,
q:after{
	content:'';
	content:none;
}

a:link{
	color: #003769;
	text-decoration: underline;
}

a:visited{
	color: #003769;
	text-decoration:underline;
}

a:hover,
a:active{
	color:#000000;
	text-decoration:none;
}

img{
	vertical-align:top;
	font-size:0;
	line-height:0;
}

html{
	overflow-x: hidden;
}

body{
    overflow-x: hidden;
	position: relative;
	width: 100%;
    background-color: #ffffff;
    font-size: 16px;
	line-height:160%;
	font-family: 'Zen Kaku Gothic New', 'Noto Sans CJK JP', 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
	font-weight: 500;
	font-style: normal;
	letter-spacing: 0.02em;
	text-align:left;
	color:#333333;
}

.sp{
    display: none;
}

.pc{
}

.contents-box{
    max-width: 1100px;
    width: auto;
    margin: auto;
}

.index-subtitle{
    display:flex;
    align-items:center;
}

.index-subtitle.index-subtitle-blue{
    color: #162393;
}

.index-subtitle.index-subtitle-white{
    color: #fff;
}

.index-subtitle .en{
    position: relative;
    margin-left: 35px;
    font-family: 'Oswald';
    font-size: 60px;
    font-weight: 700;
    line-height: 55px;
}

.index-subtitle .en::before {
    content: "";
    position: absolute;
    top: 4px;
    left: -35px;
    width: 20px;
    height: 55px;
}

.index-subtitle.index-subtitle-blue .en::before{
    background-color: #162393;
}

.index-subtitle.index-subtitle-white .en::before{
    background-color: #fff;
}

.index-subtitle .jp{
    margin: 5px 0 0 20px;
    font-size: 24px;
    font-weight: 600;
    line-height: 29px;
}

.scroll-point{
	position: absolute;
    margin-top: -100px;
}

.soon{
	padding: 200px 0;
    text-align: center;
}

@media screen and (max-width:1140px){
body{
    font-size: 14px;
}

.contents-box{
    margin: 0 20px;
}

.index-subtitle-box{
    display: flex;
    justify-content: center;
    align-items: center;
}

.index-subtitle .en{
    font-size: 40px;
    font-weight: 700;
    line-height: 40px;
}

.index-subtitle .en::before {
    width: 20px;
    height: 40px;
}

.index-subtitle .jp{
    font-size: 15px;
    line-height: 21px;
}

.scroll-point{
    margin-top: 0px;
}
}

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

.sp{
    display: block;
}

.pc{
    display: none;
}
}

/*Chrome Opera*/
@media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) {
}

/*=========================================*/
/* Header */
/*=========================================*/

.header{
    position: fixed;
    top: 0;
    left: 0;
	z-index:999;
    width: 100%;
	height: 100px;
    background-color:rgba(0,0,0,0.8);
}

.header-area{
	width: 100%;
	position: relative;
	display: flex;
    justify-content: space-between;
}

.header-area .logo{
	width: 260px;
	padding: 15px 0px 0 30px;
	text-align: left;
}

.header-area .logo a{
	display: block;
}

.header-area .logo img{
	width: 100%;
}

.global-navi{
	width: auto;
}

.global-navi ul{
	display: inline-block;
}

.global-navi li{
    position: relative;
    display: block;
	font-size:16px;
	letter-spacing: 0.04em;
    line-height: 100px;
	text-align: left;
	float: left;
}

.global-navi li.navi-recruit{
    margin-left: 20px;
}

.global-navi a{
    display:flex;
    justify-content:center;
    align-items:center;
    height: 100px;
	padding: 0 30px;
	color: #fff;
	text-align: center;
	text-decoration:none;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.global-navi a:hover{
	color: #888;
	transition: all 0.5s;
}

.global-navi .navi-recruit a{
    display:flex;
    justify-content:center;
    align-items:center;
    flex-direction: column;
    padding: 0 50px;
    background-color: #0098d9;
    font-size: 22px;
    line-height: 1;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.global-navi .navi-recruit a:hover{
    background-color: #0082af;
	color: #fff;
	transition: all 0.5s;
}

.global-navi .navi-recruit .jp{
    padding-bottom: 5px;
    border-bottom: solid 2px #fff;
}

.global-navi .navi-recruit .en{
    font-family: 'Zen Kaku Gothic New';
    font-weight: 400;
}

.global-navi .navi-tel a{
    padding: 0 40px;
    background-color: #162393;
	font-family: 'Oswald';
    font-size: 26px;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.global-navi .navi-tel a:hover{
    background-color: #001175;
	color: #fff;
	transition: all 0.5s;
}

.global-navi .navi-tel .tel{
    display: flex;
    padding-left: 40px;
	background-image:url("images/icon-tel.svg");
	background-position: left center;
	background-repeat:no-repeat;
	background-size: 29px;
}

.global-navi .navi-contact a{
    padding: 0 30px;
    background-color: #ff0006;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.global-navi .navi-contact a:hover{
    background-color: #c6000f;
	color: #fff;
	transition: all 0.5s;
}

.global-navi .navi-contact img{
    width: 32px;
}

@media screen and (max-width:1520px){
.header-area .logo{
	width: 220px;
	padding: 22px 0px 0 20px;
}

.global-navi li{
	font-size:15px;
}

.global-navi li.navi-recruit{
    margin-left: 10px;
}

.global-navi a{
	padding: 0 20px;
}

.global-navi .navi-recruit a{
    padding: 0 20px;
    font-size: 18px;
}

.global-navi .navi-tel a{
    padding: 0 20px;
    font-size: 22px;
}

.global-navi .navi-tel .tel{
    padding-left: 30px;
	background-size: 20px;
}

.global-navi .navi-contact a{
    padding: 0 20px;
}
}

@media screen and (max-width:1200px){
.header-area .logo{
	width: 200px;
	padding: 24px 0px 0 20px;
}

.global-navi li{
	font-size:15px;
}

.global-navi li.navi-recruit{
    margin-left: 10px;
}

.global-navi a{
	padding: 0 12px;
}

.global-navi .navi-recruit a{
    padding: 0 20px;
    font-size: 16px;
}

.global-navi .navi-tel a{
    padding: 0 20px;
    font-size: 20px;
}

.global-navi .navi-tel .tel{
    padding-left: 30px;
	background-size: 20px;
}

.global-navi .navi-contact a{
    padding: 0 20px;
}
}

@media screen and (max-width:1140px){
.header{
    position: absolute;
	height: auto;
    background-color:rgba(0,0,0,0.0);
}

.header-area .logo{
	width: 218px;
	padding: 20px 0px 0 20px;
}

.global-navi{
	display: none;
}
}

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

/*=========================================*/
/* sp navi */
/*=========================================*/

.g-nav{
    position:fixed;
    z-index: 9999;
    top:0;
    right: -120%;
    width:100%;
    height: 100vh;
    background-color: #162393;
    transition: all 0.8s;
}

/*アクティブクラスがついたら位置を0に*/
.g-nav.panelactive{
    right: 0;
    background-color: #162393;
}

/*ナビゲーションの縦スクロール*/
.g-nav.panelactive #g-nav-list{
    position:fixed;
    z-index: 999999; 
    width: 100%;
    height: 100vh;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

.g-nav-list-area{
	width: 100%;
	max-width: 1000px;
	margin: auto;
	padding: 22px 0;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap:         wrap;
}

.g-nav-list-area .g-nav-logo{
	width: 100%;
	padding: 0 0 22px 20px;
	text-align: left;
	border-bottom: solid 1px rgba(255,255,255,0.1);
}

.g-nav-list-area .g-nav-logo a{
	width: 160px;
	display: block;
}

.g-nav-list-area .g-nav-logo img{
	width: 100%;
}

.g-nav-list-area .box{
    width: 100%;
	padding: 0px 0 20px 0;
}

.g-nav-list-area ul{
	padding: 0px 0 25px 0;
}

.g-nav-list-area li{
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.04em;
}

.g-nav-list-area li a{
    display: block;
	padding: 12px 20px 12px 20px;
	border-bottom: solid 1px rgba(255,255,255,0.1);
	color: #fff;
	text-decoration: none;
}

.openbtn_scroll{
    display: none;
    position:fixed;
    z-index: 999999;
    top:20px;
    right: 5px;
    cursor: pointer;
    width: 60px;
    height:50px;
}

.openbtn_scroll span{
    display: inline-block;
    transition: all .4s;
    position: absolute;
    left: 14px;
    height: 2px;
    border-radius: 2px;
    background-color: #ffffff;
    width: 45%;
}

.openbtn_scroll.openbtn_scroll-black span{
    background-color: #000;
}

.openbtn_scroll span:nth-of-type(1) {
	top:12px; 
}

.openbtn_scroll span:nth-of-type(2) {
	top:20px;
}

.openbtn_scroll span:nth-of-type(3) {
	top:28px;
}

.openbtn_scroll.active span:nth-of-type(1) {
    top: 15px;
    left: 18px;
    transform: translateY(6px) rotate(-45deg);
    width: 45%;
    background-color: #ffffff;
}

.openbtn_scroll.active span:nth-of-type(2) {
	opacity: 0;
}

.openbtn_scroll.active span:nth-of-type(3){
    top: 27px;
    left: 18px;
    transform: translateY(-6px) rotate(45deg);
    width: 45%;
    background-color: #ffffff;
}

.openbtn_scroll {
	opacity: 1;
	transition: ease .3s opacity;
}

@media screen and (max-width:1140px){
.openbtn_scroll{
    display: block;
}
}

/*=========================================*/
/* index KV Movie */
/*=========================================*/

.c-mv {
  position: relative;
  width: 100%;
  height: 900px;
  overflow: hidden;
}

.c-mv__video {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100vw;
  height: 56.25vw; /* 100vw x 9 / 16 = 56.25vw（16:9比率） */

  /* 最低限、縦500pxに足りない場合は補う */
  min-width: 177.78%;
  min-height: 100%;

  z-index: 0;
  pointer-events: none; /* 任意でクリック無効化 */
}


@media screen and (max-width: 1140px) {
  .c-mv {
    height: 320px; /* ここも固定に */
  }
}

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

.index-mv{
    display:flex;
    overflow: hidden; /* スライドがコンテナ外に出ないように非表示 */
    justify-content:center;
    align-items:center;
    flex-direction: column;
    position: relative;
    width: 100%;
    height: 900px;
    background-color: #000;
    color: #fff;
    font-family: 'Oswald';
    font-weight: 600;
    text-align: center;
}

/* 画像の配置 */
.slideimg {
    position: absolute; /* 位置を絶対指定で重ねて配置 */
    inset: 0; /* 親要素内にフルサイズで配置 */
    opacity: 0; /* 初期状態で透明に */
    width: 100%;
    background-size: cover; /* 画像をスライド全体にカバー */
    background-position: center;
    animation: slideAnime 24s infinite; /* 1サイクル--秒を無限ループ */
}

/* スライド個別設定 */
.slideimg:nth-of-type(1) {
    background-image: url("images/index-mv01-2.jpg");
    animation-delay: 0s;
}
.slideimg:nth-of-type(2) {
    background-image: url("images/index-mv02.jpg");
    animation-delay: 8s;
}
.slideimg:nth-of-type(3) {
    background-image: url("images/index-mv03.jpg");
    animation-delay: 16s;
}

/* タイミング設定 */
@keyframes slideAnime {
    0%, 10%, 40% {
        opacity: 0; /* 非表示のタイミング */
    }
    10%, 30% {
        opacity: 1; /* 表示されるタイミング */
    }
}

.index-mv .catch01{
    z-index: 1;
    font-size: 50px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
}

.index-mv .catch02{
    z-index: 1;
    padding: 5px 0 0 0;
    font-size: 97px;
    line-height: 105px;
    letter-spacing: 0.1em;
}

.index-mv .catch02 .number{
    z-index: 1;
    font-size: 108px;
    font-weight: 500;
    letter-spacing: 0.05em;
}

.index-mv .catch03{
    z-index: 1;
    padding: 20px 0 0 0;
    font-size: 54px;
    line-height: 54px;
    letter-spacing: 0.1em;
}


@media screen and (max-width:1140px){
.index-mv{
    height: 530px;
}

.index-mv .catch01{
    margin-top: 50px;
    font-size: 27px;
    line-height: 27px;
}

.index-mv .catch02{
    padding: 5px 0 0 0;
    font-size: 53px;
    line-height: 57px;
}

.index-mv .catch02 .number{
    font-size: 57px;
}

.index-mv .catch03{
    padding: 5px 0 0 20px;
    font-size: 30px;
    line-height: 40px;
    font-weight: 400;
}
}

@media screen and (max-width:640px){
/* スライド個別設定 */
.slideimg:nth-of-type(1) {
    background-image: url("images/index-mv01-2-sp.jpg");
}
.slideimg:nth-of-type(2) {
    background-image: url("images/index-mv02-sp.jpg");
}
.slideimg:nth-of-type(3) {
    background-image: url("images/index-mv03-sp.jpg");
}
}

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

.index-information{
    position: relative;
}

.index-information .box{
    position: absolute;
    width: 700px;
    top: -30px;
    left: 50%;
    margin-left: -350px;
    background-color: #162393;
}

.index-information a{
    display:flex;
    align-items:center;
    padding: 13px 13px 13px 23px;
    background-color: #fff;
	color: #000;
	text-decoration:none;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.index-information a:hover{
    opacity: 0.5;
	transition: all 0.5s;
}

.index-information .day{
    width: 90px;
}

.index-information .category{
    width: 120px;
    height: 35px;
    background-color: #162393;
    line-height: 35px;
    text-align: center;
    color: #fff;
}

.index-information .text{
    flex: 1;
    padding: 0 40px 0 20px;
    padding-right: 40px;
	background-image:url("images/icon-arrow4.svg");
	background-position: right 15px center;
	background-repeat:no-repeat;
	background-size: 20px;
    font-size: 18px;
}

@media screen and (max-width:1140px){
.index-information a{
    padding: 6px 6px 6px 13px;
}
}

@media screen and (max-width:800px){
.index-information a{
    padding: 6px 6px 6px 6px;
}

.index-information .box{
    width: calc(100% - 40px);
    top: -20px;
    left: 0;
    margin: 0 20px;
}

.index-information .day{
    width: 65px;
    font-size: 12px;
}

.index-information .category{
    width: 72px;
    height: 26px;
    font-size: 12px;
    font-weight: 400;
    line-height: 26px;
}

.index-information .text{
    padding: 0 20px 0 8px;
	background-position: right 10px center;
	background-repeat:no-repeat;
	background-size: 14px;
    font-size: 12px;
    line-height: 14px;
}
}

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

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

.index-about{
    padding: 130px 0 170px 0;
	background-image:url("images/index-about-back.jpg");
	background-position: center;
	background-repeat:no-repeat;
	background-size: cover;
}

.index-about .contents-box{
    display:flex;
    align-items:center;
}

.index-about .movie{
    width: 100%;
    max-width: 535px;
    margin-right: 40px;
}

.index-about .movie img{
    width: 100%;
}

.index-about .movie iframe{
    width: 100%;
    height: 310px;
}

.index-about .right{
    flex: 1;
    color: #fff;
}

.index-about .read{
    padding-top: 18px;
    font-size: 26px;
    font-weight: 600;
    line-height: 40px;
}

.index-about .text{
    padding-top: 16px;
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
}

.index-about .btn{
    padding: 25px 0 0 0;
}

.index-about .btn a{
    display: block;
    width: 300px;
    height: 50px;
    background-color: #fff;
    color: #000;
    text-decoration: none;
    text-align: center;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.index-about .btn a:hover{
    opacity: 0.7;
	transition: all 0.5s;
}

.index-about .btn .ic{
    padding: 0 0 0 20px;
	background-image:url("images/icon-arrow.svg");
	background-position: left center;
	background-repeat:no-repeat;
	background-size: 11px;
    font-size: 16px;
    line-height: 50px;
}

@media screen and (max-width:1140px){
.index-about{
    padding: 60px 0 85px 0;
}

.index-about .contents-box{
    flex-direction: column;
}

.index-about .movie{
    margin: auto;
}

.index-about .movie iframe{
    height: 220px;
}

.index-about .right{
    margin-top: 22px;
    text-align: center;
}

.index-about .read{
    padding-top: 12px;
    font-size: 20px;
    line-height: 30px;
}

.index-about .text{
    padding-top: 7px;
    font-size: 14px;
    font-weight: 400;
    line-height: 26px;
}

.index-about .btn{
    padding: 15px 0 0 0;
}

.index-about .btn a{
    width: 220px;
    height: 37px;
    margin: auto;
}

.index-about .btn .ic{
    padding: 0 0 0 15px;
	background-size: 6px;
    font-size: 14px;
    line-height: 37px;
}
}

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

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

.index-about2{
    padding: 100px 0 170px 0;
	background-image:url("images/index-about-back.jpg");
	background-position: center;
	background-repeat:no-repeat;
	background-size: cover;
}

.index-about2 .movie-box{
    display:flex;
    align-items:center;
    gap: 30px;
    padding: 50px 0 0 0;
}

.index-about2 .movie{
    width: 100%;
    max-width: 535px;
}

.index-about2 .movie img{
    width: 100%;
}

.index-about2 .movie iframe{
    width: 100%;
    height: 310px;
}

.index-about2 .right{
    flex: 1;
    color: #fff;
}

.index-about2 .read{
    padding-top: 18px;
    font-size: 26px;
    font-weight: 600;
    line-height: 40px;
}

.index-about2 .text{
    padding-top: 15px;
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
}

.index-about2 .btn{
    padding: 30px 0 0 0;
}

.index-about2 .btn a{
    display: block;
    width: 300px;
    height: 50px;
    background-color: #fff;
    color: #000;
    text-decoration: none;
    text-align: center;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.index-about2 .btn a:hover{
    opacity: 0.7;
	transition: all 0.5s;
}

.index-about2 .btn .ic{
    padding: 0 0 0 20px;
	background-image:url("images/icon-arrow.svg");
	background-position: left center;
	background-repeat:no-repeat;
	background-size: 11px;
    font-size: 16px;
    line-height: 50px;
}

@media screen and (max-width:1140px){
.index-about2{
    padding: 50px 0 85px 0;
}

.index-about2 .movie-box{
    flex-direction: column;
    gap: 10px;
    padding: 40px 0 0 0;
}

.index-about2 .movie{
    margin: auto;
}

.index-about2 .movie iframe{
    height: 220px;
}

.index-about2 .right{
    margin-top: 22px;
    text-align: center;
}

.index-about2 .read{
    padding-top: 12px;
    font-size: 20px;
    line-height: 30px;
}

.index-about2 .text{
    padding-top: 7px;
    font-size: 14px;
    font-weight: 400;
    line-height: 26px;
}

.index-about2 .btn{
    padding: 15px 0 0 0;
}

.index-about2 .btn a{
    width: 220px;
    height: 37px;
    margin: auto;
}

.index-about2 .btn .ic{
    padding: 0 0 0 15px;
	background-size: 6px;
    font-size: 14px;
    line-height: 37px;
}
}

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

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

.index-instagram{
    margin-top: -70px;
}

.index-instagram .contents-box{
    background-color: #fff;
	box-shadow: 0 5px 10px rgba(0,0,0,0.1);
}

.index-instagram .title-box{
    display: flex;
    align-items: center;
    padding: 25px 25px 5px 25px;
}

.index-instagram .title{
    display: flex;
    align-items: center;
    margin-right: 35px;
}

.index-instagram .icon{
    width: 43px;
    margin-right: 20px;
}

.index-instagram .icon img{
    width: 100%;
}

.index-instagram .insta{
    font-family: 'Oswald';
    font-size: 37px;
    font-weight: 600;
    line-height: 37px;
    color: #0b318e;
}

.index-instagram .read{
    font-size: 18px;
    font-weight: 400;
    line-height: 20px;
}

.index-instagram .btn{
    margin-left: auto;
    font-family: 'Oswald';
    font-size: 20px;
    font-weight: 600;
    line-height: 35px;
}

.index-instagram .btn a{
    padding: 0 30px 0 0;
	background-image:url("images/icon-arrow4.svg");
	background-position: right center;
	background-repeat:no-repeat;
	background-size: 20px;
    font-size: 16px;
    color: #000;
    text-decoration: none;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.index-instagram .btn a:hover{
    opacity: 0.7;
	transition: all 0.5s;
}

.index-instagram .feed{
    margin: auto;
    padding: 15px 25px 0 25px;
}

.index-instagram .img{
    margin: auto;
    padding: 25px;
}

.index-instagram .img img{
    width: 100%;
}

.index-instagram .img img.large{
}

.index-instagram .img img.small{
    display: none;
}

@media screen and (max-width:1140px){
.index-instagram{
    margin-top: -50px;
}

.index-instagram .contents-box{
    max-width: calc(600px - 40px);
    margin: auto;
}

.index-instagram .title-box{
    flex-direction: column;
    padding: 20px 20px 5px 20px;
    text-align: center;
}

.index-instagram .title{
    margin-right: 0px;
}

.index-instagram .icon{
    width: 36px;
    margin-right: 13px;
}

.index-instagram .icon img{
    width: 100%;
}

.index-instagram .insta{
    font-size: 31px;
    line-height: 31px;
}

.index-instagram .read{
    padding-top: 10px;
    font-size: 14px;
    line-height: 22px;
}

.index-instagram .btn{
    padding-top: 10px;
    margin: auto;
    font-size: 16px;
    line-height: 16px;
}

.index-instagram .btn a{
    padding: 0 20px 0 10px;
	background-size: 15px;
    font-size: 16px;
}

.index-instagram .feed{
    max-width: 600px;
    padding: 20px 20px 0 20px;
}

.index-instagram .img{
    max-width: 600px;
    padding: 20px;
}
}

@media screen and (max-width:640px){
.index-instagram .contents-box{
    max-width: 400px;
    margin: 0 auto;
}

.index-instagram .img img.large{
    display: none;
}

.index-instagram .img img.small{
    display: block;
}
}

@media screen and (max-width:440px){
.index-instagram .contents-box{
    max-width: auto;
    margin: 0 20px;
}
}

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

.index-policy{
    padding: 100px 0;
}

.index-policy .contents-box{
}

.index-policy .title{
    width: 55px;
    margin-right: 25px;
}

.index-policy .title img{
    width: 55px;
}

.index-policy .list{
    display: flex;
    justify-content: space-between;
    flex-wrap:wrap;
    gap: 20px;
    flex: 1;
    margin-top: 30px;
}

.index-policy .box{
    width: calc(33.333% - 20px);
    margin-bottom: 10px;
	box-shadow: 3px 3px 8px rgba(0,0,0,0.2);
}

.index-policy .img{
    width: 100%;
}

.index-policy .img img{
    width: 100%;
}

.index-policy .read{
    text-align: center;
    font-family: 'Oswald';
    font-size: 28px;
    font-weight: 600;
    color: #0b318e;
}

.index-policy .text{
    padding: 0px 20px 0px 20px;
    font-size: 16px;
    line-height: 26px;
}

.accordion {
  width: 100%;
  border-radius: 4px;
  margin: 20px auto 15px auto;
  font-family: sans-serif;
}

.accordion input[type="checkbox"] {
  display: none;
}

.accordion-label {
    display: flex;
    justify-content: center;
    height: 40px;
    font-family: 'Oswald';
    font-size: 28px;
    font-weight: 600;
    color: #0b318e;
    text-align: center;
    position: relative;
}

/* ＋/−ボタン（デフォルト非表示） */
.accordion-label::after {
  display: none; /* ← 640px以上では非表示 */
  content: '';
}

/* コンテンツ：デフォルトで表示（640px以上） */
.accordion-content {
  display: block;
}

@media screen and (max-width:1140px){
.index-policy{
    padding: 60px 0;
}

.index-policy .contents-box{
    flex-direction: column;
}

.index-policy .title{
    display: none;
}

.index-policy .index-subtitle{
    display: flex;
}

.index-policy .list{
    margin-top: 15px;
}
}

@media screen and (max-width:840px){
.index-policy .list{
    gap: 10px;
}

.index-policy .box{
    width: calc(50% - 10px);
}
}

@media screen and (max-width:480px){
.index-policy .list{
    align-items: flex-start;
}

.index-policy .box{
    max-width: 100%;
}

.index-policy .text{
    font-size: 14px;
    line-height: 22px;
}

.accordion {
    margin: 10px auto 0px auto;
}

.accordion-label {
    position: relative;
    text-align: center;
    cursor: pointer;
    font-size: 15px;
    height: 35px;
}

  /* ＋ボタン表示 */
  .accordion-label::after {
    display: inline-block;
    position: absolute;
    content: '+';
    font-size: 28px;
    font-weight: 400;
    right: 10px;
    top: 2px;
    transition: transform 0.3s ease;
  }

  /* チェック時は−に */
  .accordion input[type="checkbox"]:checked + .accordion-label::after {
    content: '−';
  }

  /* アコーディオン閉じた状態 */
  .accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease, padding 0.3s ease;
  }

  /* チェックされたときに開く */
  .accordion input[type="checkbox"]:checked ~ .accordion-content {
    max-height: 200px;
    padding: 0px 0px 20px 0px;
  }
}


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

.index-works{
    padding: 0 0 150px 0;
	background-image:url("images/index-works-back.jpg");
	background-position:top 60px center;
	background-repeat:no-repeat;
	background-size: 100%;
}

.index-works .index-works-box{
    display:flex;
    align-items:flex-end;
}

.index-works .img-top{
    max-width: 655px;
    margin-right: 55px;
}

.index-works .img-top img{
    width: 100%;
	box-shadow: 3px 3px 8px rgba(0,0,0,0.2);
}

.index-works .right{
    flex: 1;
    margin-right: 15px;
    color: #fff;
}

.index-works .right .read{
    padding-top: 22px;
    font-size: 26px;
    font-weight: 600;
    line-height: 40px;
}

.index-works .right .text{
    padding-top: 16px;
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
}

.index-works .list{
    display: flex;
    flex-wrap:wrap; 
    gap: 20px;
    margin-top: 60px;
}

.index-works .list .box{
    width: calc(33.333% - 20px);
    margin-bottom: 10px;
    background-color: #fff;
	box-shadow: 3px 3px 8px rgba(0,0,0,0.2);
}

.index-works .list a{
    display: block;
    color: #000;
    text-decoration: none;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.index-works .list a:hover{
    opacity: 0.7;
	transition: all 0.5s;
}

.index-works .list .img {
    position: relative;
    width: 100%;
    height: 212px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    background-color: #E6E6E6; /* 背景色（任意） */
    text-align: center;
}

.index-works .list .img img {
    max-width: 100%;
    max-height: 100%;
    height: auto;
    width: auto;
    margin: auto;
    object-fit: contain; /* 念のため入れてもOK */
}

.index-works .list .category{
    position: absolute;
    display: block;
    left: 0;
    bottom: 0;
    padding: 5px 20px;
    background-color: #162393;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
}

.index-works .list .text-area{
    display: block;
    padding: 15px 20px;
}

.index-works .list .title{
    display: block;
    font-size: 18px;
    font-weight: 600;
    line-height: 25px;
}

.index-works .list .data{
    display: flex;
    justify-content: space-between;
    padding: 10px 0px 0px 0px;
}

.index-works .list .order{
    font-size: 14px;
    font-weight: 500;
}

.index-works .list .day{
    font-size: 14px;
    font-weight: 500;
}

.index-works .btn{
    padding: 40px 0 0 0;
}

.index-works .btn a{
    display: block;
    width: 300px;
    height: 50px;
    margin: auto;
    background-color: #1a1a1a;
    color: #fff;
    text-decoration: none;
    text-align: center;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.index-works .btn a:hover{
    opacity: 0.7;
	transition: all 0.5s;
}

.index-works .btn .ic{
    padding: 0 0 0 20px;
	background-image:url("images/icon-arrow3.svg");
	background-position: left center;
	background-repeat:no-repeat;
	background-size: 11px;
    font-size: 16px;
    line-height: 50px;
}

@media screen and (max-width:1420px){
.index-works{
	background-size: 1920px 600px;
}
}

@media screen and (max-width:1140px){
.index-works{
    padding: 0 0 60px 0;
	background-size: 1312px 410px;
}

.index-works .index-works-box{
    flex-direction: column;
}

.index-works .img-top{
    max-width: 330px;
    margin: auto;
}

.index-works .right{
    margin: 22px auto 0 auto;
    text-align: center;
}

.index-works .right .read{
    padding-top: 13px;
    font-size: 20px;
    line-height: 30px;
}

.index-works .right .text{
    padding-top: 9px;
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
}

.index-works .list .img {
    height: 100px;
}

.index-works .btn{
    padding: 15px 0 0 0;
}

.index-works .btn a{
    width: 220px;
    height: 37px;
    margin: auto;
}

.index-works .btn .ic{
    padding: 0 0 0 15px;
	background-size: 6px;
    font-size: 14px;
    line-height: 37px;
}
}

@media screen and (max-width:640px){
.index-works .list{
    gap: 5px;
    margin-top: 50px;
}

.index-works .list .box{
    width: calc(50% - 5px);
}

.index-works .list .category{
    padding: 4px 10px;
    font-size: 10px;
    line-height: 14px;
}

.index-works .list .text-area{
    padding: 5px 10px;
}

.index-works .list .title{
    font-size: 14px;
    line-height: 20px;
}

.index-works .list .data{
    flex-direction: column;
    padding: 10px 0px 5px 0px;
}

.index-works .list .order{
    font-size: 12px;
    line-height: 14px;
}

.index-works .list .day{
    font-size: 12px;
    line-height: 14px;
}
}

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

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

.index-recruit{
    display: flex;
    align-items: flex-end;
    height: 480px;
    margin-bottom: 80px;
	background-image:url("images/index-recruit-back.jpg");
	background-position:center;
	background-repeat:no-repeat;
	background-size: 100%;
}

.index-recruit-box{
    display: flex;
    justify-content: space-between;
    align-items:center;
    width: 850px;
    margin: 0 auto 0px auto;
    padding: 30px 0px;
    background-color: #fff;
	box-shadow: 3px 3px 8px rgba(0,0,0,0.2);
}

.index-recruit-box .left{
    padding: 0px 0 10px 40px;
}

.index-recruit-box .btn{
    padding: 0px 40px 0 0;
}

.index-recruit-box .btn a{
    display: block;
    width: 300px;
    height: 50px;
    margin: auto;
    border: solid 1px #162393;
	border-radius: 500px;
    color: #162393;
    text-decoration: none;
    text-align: center;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.index-recruit-box .btn a:hover{
    color: #fff;
    background-color: #162393;
	transition: all 0.5s;
}

.index-recruit-box .btn .ic{
    padding: 0 0 0 20px;
	background-image:url("images/icon-arrow2.svg");
	background-position: left center;
	background-repeat:no-repeat;
	background-size: 11px;
    font-size: 16px;
    line-height: 50px;
}

.index-recruit-box .btn a:hover .ic{
	background-image:url("images/icon-arrow3.svg");
}

@media screen and (max-width:1920px){
.index-recruit{
	background-size: 1920px 400px;
}
}

@media screen and (max-width:1140px){
.index-recruit{
    height: 280px;
    margin-bottom: 80px;
	background-image:url("images/index-recruit-back-sp.jpg");
    background-size: cover;
}

.index-recruit-box{
    flex-direction: column;
    max-width: 600px;
    margin: 0 auto -50px auto;
    padding: 15px 0px 20px 0px;
}

.index-recruit-box .left{
    padding: 0px 0 10px 0px;
}

.index-recruit-box .btn{
    padding: 5px 0px 0 0;
}

.index-recruit-box .btn a{
    width: 260px;
    height: 44px;
}

.index-recruit-box .btn .ic{
    padding: 0 0 0 15px;
	background-image:url("images/icon-arrow2.svg");
	background-position: left center;
	background-repeat:no-repeat;
	background-size: 7px;
    font-size: 14px;
    line-height: 44px;
}

.index-recruit-box .btn a:hover .ic{
	background-image:url("images/icon-arrow3.svg");
}
}

@media screen and (max-width:640px){
.index-recruit-box{
    max-width: 330px;
}
}

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

.index-news{
    padding: 0 0 100px 0;
}

.index-news-title{
    display: flex;
    justify-content: space-between;
    align-items:center;
    max-width: 830px;
    margin: 0 auto 0px auto;
}

.index-news-title .left{
}

.index-news .btn{
    padding: 10px 0 0 0;
}

.index-news .btn a{
    display: block;
    width: 300px;
    height: 50px;
    margin: auto;
    background-color: #1a1a1a;
    color: #fff;
    text-decoration: none;
    text-align: center;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.index-news .btn a:hover{
    opacity: 0.7;
	transition: all 0.5s;
}

.index-news .btn .ic{
    padding: 0 0 0 20px;
	background-image:url("images/icon-arrow3.svg");
	background-position: left center;
	background-repeat:no-repeat;
	background-size: 11px;
    font-size: 16px;
    line-height: 50px;
}

.index-news .list{
    display: flex;
    flex-wrap: wrap;
    max-width: 830px;
    margin: 0 auto 0px auto;
    padding: 25px 0px 0px 0px;
}

.index-news .list .box{
    max-width: calc(33.333% - 0px);
    margin-bottom: 10px;
}

.index-news .list a{
    display: block;
    border-left:solid 1px #162393;
    border-right:solid 1px #162393;
    padding: 0 13px;
    margin-left: -1px;
    color: #000;
    text-decoration: none;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.index-news .list .box:first-child a{
}

.index-news .list a:hover{
    opacity: 0.7;
	transition: all 0.5s;
}

.index-news .list .img{
}

.index-news .list .img img{
    width: 100%;
}

.index-news .list .category{
    margin-top: 12px;
    display: inline-block;
    padding: 5px 20px;
    background-color: #162393;
    font-size: 16px;
    font-weight: 500;
    color: #fff;
}

.index-news .list .title{
    display: block;
    margin-top: 12px;
    font-size: 18px;
    font-weight: 500;
    line-height: 25px;
}

.index-news .list .day{
    display: block;
    margin-top: 17px;
    padding: 0 28px 0 0;
	background-image:url("images/icon-arrow4.svg");
	background-position: right center;
	background-repeat:no-repeat;
	background-size: 18px;
    font-size: 16px;
    font-weight: 500;
}

@media screen and (max-width:1140px){
.index-news{
    padding: 30px 0 50px 0;
}

.index-news-title{
    flex-direction: column;
    max-width: 600px;
}

.index-news .btn{
    padding: 15px 0 0 0;
}

.index-news .btn a{
    width: 220px;
    height: 37px;
    margin: auto;
}

.index-news .btn .ic{
    padding: 0 0 0 15px;
	background-size: 6px;
    font-size: 14px;
    line-height: 37px;
}

.index-news .list{
    flex-direction: column;
    max-width: 600px;
    margin: 0 auto 0px auto;
    padding: 25px 0px 10px 0px;
}

.index-news .list .box{
    max-width: calc(100%);
    margin-bottom: 0px;
}

.index-news .list a{
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    border-left:none;
    border-right:none;
    border-bottom:solid 1px #162393;
    padding: 10px 0px;
    margin-left: auto;
}

.index-news .list .box:first-child a{
    border-top:solid 1px #162393;
    border-left: none;
}

.index-news .list .img{
    width: 195px;
    margin-right: 10px;
}

.index-news .list .data{
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.index-news .list .category{
    margin-top: 0;
    padding: 0px 10px 2px 10px;
    width: auto;
    font-size: 12px;
}

.index-news .list .title{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-top: 5px;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
}

.index-news .list .day{
    margin-top: auto;
    padding: 0 0px 0 0;
    width: 100%;
	background-size: 14px;
    font-size: 12px;
    font-weight: 500;
}
}

@media screen and (max-width:640px){
.index-news .list{
    margin: 0 20px 0px 20px;
}
}

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

.common-contact{
    padding-bottom: 100px;
}

.common-contact .box{
    display: flex;
    align-items:center;
    background-color: #162393;
}

.common-contact .img{
    width: 430px;
}

.common-contact .img img{
    width: 100%;
}

.common-contact .right{
    flex: 1;
    color: #fff;
    text-align: center;
}

.common-contact .read{
    font-size: 26px;
    font-weight: 600;
}

.common-contact .read .small{
    font-size: 20px;
}

.common-contact .contact{
    display:flex;
    justify-content:center;
    align-items:center;
    padding-top: 25px;
}

.common-contact .tel-area{
}

.common-contact .tel{
    padding-left: 35px;
	background-image:url("images/icon-tel2.svg");
	background-position: left bottom;
	background-repeat:no-repeat;
	background-size: 26px;
    font-size: 35px;
    font-weight: 500;
    line-height: 30px;
}

.common-contact .text{
    padding-top: 10px;
    font-size: 18px;
    font-weight: 400;
}

.common-contact .btn{
    padding: 0px 0 0 40px;
}

.common-contact .btn a{
    display: block;
    width: 300px;
    height: 50px;
    margin: auto;
    background-color: #fff;
    color: #000;
    text-decoration: none;
    text-align: center;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.common-contact .btn a:hover{
    opacity: 0.7;
	transition: all 0.5s;
}

.common-contact .btn .ic{
    padding: 0 0 0 20px;
	background-image:url("images/icon-arrow.svg");
	background-position: left center;
	background-repeat:no-repeat;
	background-size: 11px;
    font-size: 16px;
    line-height: 50px;
}

@media screen and (max-width:1140px){
.common-contact{
    padding-bottom: 50px;
}

.common-contact .contents-box{
    max-width: 400px;
    margin: auto;
}

.common-contact .box{
    flex-direction: column;
    padding: 10px;
}

.common-contact .img{
    width: 100%;
}

.common-contact .right{
    padding: 15px 0;
}

.common-contact .read{
    font-size: 20px;
    font-weight: 500;
}

.common-contact .read .small{
    font-size: 15px;
}

.common-contact .contact{
    flex-direction: column;
    padding-top: 5px;
}

.common-contact .tel{
    padding-left: 30px;
	background-size: 22px;
    font-size: 30px;
    line-height: 30px;
}

.common-contact .text{
    padding-top: 5px;
    font-size: 15px;
}

.common-contact .btn{
    padding: 7px 0 0 0px;
}

.common-contact .btn a{
    width: 220px;
    height: 37px;
    margin: auto;
}

.common-contact .btn .ic{
    padding: 0 0 0 15px;
	background-size: 6px;
    font-size: 14px;
    line-height: 37px;
}
}

@media screen and (max-width:480px){
.common-contact .contents-box{
    max-width: auto;
    margin: 0 20px;
}
}

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

.footer{
    padding: 40px 0 40px 0;
    background-color: #162393;
    color: #fff;
}

.footer-box{
	display: flex;
    justify-content: space-between;
}

.footer-data{
    width: 300px;
}

.footer-data .logo{
	width: 280px;
	padding: 0px 0px 0 0px;
}

.footer-data .logo img{
	width: 100%;
}

.footer-data .add{
    margin-top: 15px;
    font-size: 18px;
}

.footer-data .add .post{
    margin-right: 8px;
    font-size: 16px;
}

.footer-data .tel{
    height: 33px;
    margin-top: 10px;
    padding-left: 40px;
	background-image:url("images/icon-tel.svg");
	background-position: left center;
	background-repeat:no-repeat;
	background-size: 29px;
    font-family: 'Oswald';
    font-size: 33px;
    font-weight: 400;
    line-height: 33px;
}

.footer-data .mail{
    margin-top: 10px;
    font-family: 'Oswald';
    font-size: 20px;
}

.footer-data .link{
	display: flex;
    justify-content: center;
    align-items: center;
    max-width: 250px;
    gap: 15px;
    margin-top: 30px;
}

.footer-data .instagram img{
	height: 40px;
}

.footer-data .youtube img{
	height: 40px;
}

.footer-navi{
    flex: 1;
	display: flex;
    flex-wrap:wrap;
    gap: 25px;
    margin: 5px 30px 0 30px;
}

.footer-navi .box{
}

.footer-navi .navi{
    margin-bottom: 10px;
    font-size: 18px;
}

.footer-navi a{
    color: #fff;
    text-decoration: none;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.footer-navi a:hover{
    opacity: 0.5;
	transition: all 0.5s;
}

.footer-navi ul{
    margin-bottom: 30px;

}

.footer-navi li{
    margin: 1px 0 1px 20px;
    list-style: disc;
    list-style-position: outside;
    font-size: 14px;
    font-weight: 400;
}

.footer-navi li::marker{
    font-size: 0.5em;
}

.footer-navi .btn{
    margin-top: -35px;
    width: 250px;
}

.footer-navi .btn a{
	display: flex;
    justify-content: center;
    align-items: center;
    padding: 12px 20px 15px 20px;
    background-color: #fff;
	border-radius: 500px;
    font-size: 19px;
    line-height: 1;
    color: #162393;
    text-decoration: none;
}

.footer-navi .btn a{
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.footer-navi .btn a:hover{
    opacity: 0.5;
	transition: all 0.5s;
}

.footer-navi .btn-sp{
    display: none;
}

.footer-navi .btn .left{
    text-align: right;
}

.footer-navi .btn .right{
    position: relative;
    padding-left: 10px;
    margin-left: 10px;
    text-align: left;
}

.footer-navi .btn .right::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 0;
    transform: translateY(-50%);
    width: 2px;
    height: 20px;
    background-color: #162393;
}

.footer-map{
    width: 410px;
    margin: 5px 0 0 0;
    text-align: right;
}

.footer-map iframe{
    display: block;
    width: 100%;
    height: 255px;
}

.footer-map .map-link{
    display:none;
    width: 100%;
    margin-top: 5px;
}

.footer-map .map-link a{
    height: 20px;
    padding-right: 30px;
	background-image:url("images/icon-arrow5.svg");
	background-position: right center;
	background-repeat:no-repeat;
	background-size: 20px;
    font-size: 12px;
    font-weight: 400;
    line-height: 12px;
    color: #fff;
    text-align: right;
    text-decoration: none;
}

.copyright{
    padding-top: 40px;
    font-size: 14px;
    text-align: center;
}

@media screen and (max-width:1140px){
.footer{
    padding: 30px 0 30px 0;
}

.footer-box{
	flex-direction: column;
    align-items:center;
}

.footer-data{
    order: 2;
	display: flex;
	flex-direction: column;
    align-items:center;
    width: 300px;
}

.footer-data .logo{
	width: 280px;
	padding: 30px 0px 0 0px;
}

.footer-data .add{
    margin-top: 15px;
    font-size: 15px;
}

.footer-data .add .post{
    margin-right: 8px;
    font-size: 13px;
}

.footer-data .tel{
    height: 33px;
    margin-top: 10px;
    padding-left: 40px;
    font-size: 30px;
    line-height: 30px;
}

.footer-data .mail{
    margin-top: 10px;
    font-size: 16px;
}

.footer-data .link{
    align-items:center;
    gap: 20px;
    margin: 15px 0;
}

.footer-navi{
    justify-content: center;
    order: 1;
    gap: 20px;
    margin: 5px auto 0 auto;
}

.footer-navi .btn-pc{
    width: 100%;
}

.footer-navi .btn-pc a{
    max-width: 300px;
    margin: auto;
}

.footer-navi .navi{
    margin-bottom: 10px;
    font-size: 16px;
}

.footer-navi ul{
    margin-bottom: 30px;
}

.footer-navi li{
    margin: 3px 0 3px 20px;
    font-size: 12px;
}

.footer-map{
    order: 3;
    width: 100%;
    margin: 5px 0 0 0;
}

.footer-map iframe{
    width: 100%;
    height: 175px;
}

.footer-map .map-link{
    display:block;
}

.copyright{
    padding-top: 30px;
    font-size: 12px;
}
}

/*=========================================*/
/* common title */
/*=========================================*/

.common-title{
    display: flex;
    justify-content: center;
    align-items: center;
	flex-direction: column;
    height: 600px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-color:#333;
    color: #fff;
}

.common-title-company{ background-image:url("images/common-title-back-about.jpg");}
.common-title-works{ background-image:url("images/common-title-back-works2.jpg");}
.common-title-news{ background-image:url("images/common-title-back-news.jpg");}

.common-title .title-en{
    padding: 100px 0 0 0;
    font-family: 'Oswald';
    font-size: 60px;
    font-weight: 600;
    line-height: 1;
}

.common-title .title-jp{
    position: relative;
    padding: 50px 0 0 0;
    font-size: 20px;
    font-weight: 400;
    line-height: 1;
}

.common-title .title-jp::before {
    content: "";
    position: absolute;
    top: 22px;
    left: 50%;
    transform: translateX(-50%);
    width: 48px;
    height: 8px;
    background-color: #fff;
}

@media screen and (max-width:1140px){
.common-title{
    height: 200px;
}

.common-title .title-en{
    padding: 0px 0 0 0;
    font-size: 44px;
}

.common-title .title-jp{
    padding: 30px 0 0 0;
    font-size: 15px;
}

.common-title .title-jp::before {
    top: 12px;
    width: 30px;
    height: 5px;
}
}

@media screen and (max-width:640px){
.common-title-company{ background-image:url("images/common-title-back-about-sp.jpg");}
.common-title-works{ background-image:url("images/common-title-back-works2-sp.jpg");}
.common-title-news{ background-image:url("images/common-title-back-news-sp.jpg");}
}

/*=========================================*/
/* common others */
/*=========================================*/

.common-page{
    padding: 0px 0 80px 0;
}

.common-page-notitle{
    padding: 130px 0 80px 0;
}

@media screen and (max-width:1140px){
.common-page{
    padding: 0px 0 40px 0;
}

.common-page-notitle{
    padding: 20px 0 40px 0;
}
}

/*=========================================*/
/* about */
/*=========================================*/

.about-sub-title{
    padding: 40px 0 0 0;
    color: #162393;
    text-align: center;
}

.about-sub-title .title-en{
    font-family: 'Oswald';
    font-size: 60px;
    font-weight: 600;
    line-height: 1.2;
}

.about-sub-title .title-jp{
    position: relative;
    padding: 50px 0 0 0;
    font-size: 20px;
    font-weight: 600;
    line-height: 1;
}

.about-sub-title .title-jp::before {
    content: "";
    position: absolute;
    top: 18px;
    left: 50%;
    transform: translateX(-50%);
    width: 48px;
    height: 8px;
    background-color: #162393;
}

.about-message {
    padding: 20px 0 60px 0;
}

.about-message .read{
    font-size: 20px;
    font-weight: 600;
    line-height: 39px;
    color: #162393;
    text-align: center;
}

.about-message .img{
    padding-top: 30px;
}

.about-message .img img{
    width: 100%;
}

.about-message .text{
    padding-top: 20px;
}

.about-message .text strong{
    font-size: 20px;
    font-weight: 700;
    color: #162393;
}

.about-message .name{
    padding-top: 20px;
    text-align: right;
}

.about-message .name img{
    width: 411px;
}

.about-message .box{
    display: flex;
    align-items: flex-end;
}

.about-message .box-left{
    flex: 1;
    display: flex;
}

.about-message .box-left .text01{
    padding-bottom: 10px;
    text-align: center;
}

.about-message .box-left .text02{
    width: 100%;
    max-width: 350px;
    padding: 2px 0;
    text-align: left;
}

.about-message .box-right{
    margin-left: 20px;
}

.about-message .movie{
    position: relative;
    width: 100%;
    padding-top: 45.45%;
    height: 0;
    overflow: hidden;
    margin-top: 30px;
}

.about-message .movie img{
    width: 100%;
}

.about-message .movie iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.about-pholosopy {
    padding: 40px 0 100px 0;
}

.about-pholosopy .read{
    font-size: 46px;
    font-weight: 600;
    color: #162393;
    text-align: center;
}

.about-pholosopy .text{
    font-size: 18px;
    font-weight: 500;
    line-height: 28px;
    text-align: center;
}

.about-pholosopy ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px; /* 任意の間隔 */
    margin-top: 40px;
}

.about-pholosopy li{
    box-sizing: border-box;
    text-align: center;
    padding: 0 10px;
    margin-bottom: -20px;
}

.about-pholosopy li{
    flex: 0 0 calc(100% / 3 - 10px);
    max-width: calc(100% / 3 - 10px);
}

.about-pholosopy li.img-1st{
    margin-left: 20px;
}

.about-pholosopy li.img-2nd{
    margin-right: 20px;
}

.about-pholosopy li img{
    display: block;
    width: 100%;
}

.about-initiative{
    display: flex;
    justify-content: space-between;
    flex-wrap:wrap;
    align-items: stretch;
    gap: 20px;
    padding: 40px 0 20px 0;
}

.about-initiative .box{
    display: flex;
	flex-direction: column;
    justify-content: space-between;
    width: calc(33.333% - 20px);
    margin-bottom: 10px;
    background-color: #fff;
    border: solid 1px #162393;
}

.about-initiative .placeholder {
    width: calc(16.666% - 20px);
    visibility: hidden;
}

.about-initiative .img{
}

.about-initiative .img img{
    width: 100%;
}

.about-initiative .text-area{
    margin: 0;
    padding: 20px;
}

.about-initiative .read{
    font-size: 28px;
    font-weight: 600;
    line-height: 36px;
    color: #162393;
    text-align: center;
}

.about-initiative .text{
    padding: 10px 0 0 0;
}

.about-initiative .btn{
    margin-top: auto;
    padding: 0px 20px 20px 20px;
}

.about-initiative .btn p{
    display: block;
    height: 50px;
    margin: auto;
    background-color: #1a1a1a;
    color: #fff;
    text-decoration: none;
    text-align: center;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.about-initiative .btn p:hover{
    opacity: 0.7;
	transition: all 0.5s;
}

.about-initiative .btn .ic{
    padding: 0 0 0 20px;
	background-image:url("images/icon-arrow3.svg");
	background-position: left center;
	background-repeat:no-repeat;
	background-size: 11px;
    font-size: 16px;
    line-height: 50px;
}

.about-bar{
    height: 60px;
    margin-top: 60px;
    background-color: #162393;
    font-size: 26px;
    font-weight: 600;
    line-height: 60px;
    color: #fff;
    text-align: center;
}

.about-detail{
    padding-top: 30px;
}

.about-detail ul{
}

.about-detail li{
    display: flex;
    flex-wrap:wrap;
    padding: 15px 0;
    border-bottom: solid 1px #162393;
}

.about-detail li:first-child{
    border-top: solid 1px #162393;
}

.about-detail .left{
    width: 160px;
    margin: 0 25px;
    font-size: 18px;
    font-weight: 600;
}

.about-detail .right{
    flex: 1;
    font-size: 18px;
}

.about-history-img{
    max-width: 655px;
    margin: auto;
    padding: 30px 0 0 0;
}

.about-history-img img{
    width: 100%;
}

.about-history-img .text{
    padding: 8px 0 0 0;
    text-align: right;
}

.about-access{
    display: flex;
    flex-wrap:wrap;
    gap: 25px;
    padding-top: 25px;
}

.about-access .left{
    width: 550px;
}

.about-access .left img{
    width: 100%;
}

.about-access .add{
    padding: 10px 0 0 0;
    font-size: 20px;
    font-weight: 600;
}

.about-access .tel{
    padding: 6px 0 0 0;
    font-size: 18px;
    font-weight: 600;
}

.about-access .map{
    flex: 1;
}

.about-access .map iframe{
    display: block;
    width: 100%;
    height: 380px;
}

@media screen and (max-width:1140px){
.about-sub-title{
    padding: 30px 0 0 0;
}

.about-sub-title .title-en{
    font-size: 44px;
}

.about-sub-title .title-jp{
    padding: 30px 0 0 0;
    font-size: 15px;
}

.about-sub-title .title-jp::before {
    top: 10px;
    width: 30px;
    height: 5px;
}

.about-message {
    padding: 25px 0 50px 0;
}

.about-message .read{
    line-height: 26px;
    text-align: center;
}

.about-message .img{
    padding-top: 15px;
}

.about-message .text{
    padding-top: 10px;
}
    
.about-message .text strong{
    font-size: 16px;
}
 
.about-message .name{
    padding-top: 15px;
}

.about-message .name img{
    width: 220px;
}

.about-message .box{
    display: block;
}

.about-message .box-left{
    width: auto;
    margin-top: 5px;
}

.about-message .box-left .text01{
    font-size: 18px;
    padding-bottom: 5px;
}

.about-message .box-left .text02{
    padding: 4px 0;
    font-size: 17px;
}

.about-message .box-right{
    margin-top: 5px;
    margin-left: 0px;
}

.about-message .movie{
    padding-top: 55%;
}

.about-pholosopy {
    padding: 20px 0 60px 0;
}

.about-pholosopy .read{
    font-size: 30px;
    line-height: 40px;
}

.about-pholosopy .read-first{
    margin-right: 30px;
}

.about-pholosopy .read-second{
    margin-left: 30px;
}

.about-pholosopy .text{
    font-size: 14px;
    line-height: 25px;
}

.about-pholosopy ul{
    max-width: 400px;
    margin: 40px auto 0 auto;
    gap: 5px; /* 任意の間隔 */
    margin-top: 20px;
}

.about-pholosopy li{
    flex: 0 0 calc(100% / 2 - 5px);
    max-width: calc(100% / 2 - 5px);
    padding: 0 5px;
}

.about-pholosopy li.img-1st{
    margin-left: auto;
}

.about-pholosopy li.img-2nd{
    margin-right: auto;
}

.about-pholosopy li.img-3rd{
    flex: 0 0 calc(100% / 1 - 5px);
    max-width: calc(100% / 1 - 5px);
}

.about-pholosopy li.img-3rd img{
    display: block;
    width: calc(50% - 5px);
    margin: auto;
}

.about-initiative{
    gap: 7px;
    max-width: 600px;
    padding: 20px 0 0px 0;
    margin: auto;
}

.about-initiative .box{
    width: calc(50% - 7px);
    margin-bottom: 5px;
}

.about-initiative .placeholder {
    display: none;
}

.about-initiative .text-area{
    padding: 10px;
}

.about-initiative .read{
    font-size: 20px;
    line-height: 26px;
}

.about-initiative .text{
    padding: 10px 0 0 0;
}

.about-initiative .btn{
    padding: 0px 10px 10px 10px;
}

.about-initiative .btn p{
    height: 37px;
}

.about-initiative .btn .ic{
    padding: 0 0 0 15px;
	background-size: 6px;
    font-size: 14px;
    line-height: 37px;
}

.about-bar{
    height: 45px;
    margin-top: 60px;
    font-size: 20px;
    line-height: 45px;
}

.about-detail{
    padding-top: 10px;
}

.about-detail li{
    padding: 10px 0;
}

.about-detail .left{
    width: 115px;
    margin: 0 15px 0 0;
    font-size: 14px;
}

.about-detail .right{
    font-size: 14px;
}

.about-history-img{
    max-width: 600px;
    padding: 10px 0 0 0;
}

.about-history-img .text{
    padding: 5px 0 0 0;
    font-size: 12px;
}

.about-access{
	display: block;
    max-width: 600px;
    margin: auto;
    padding-top: 10px;
}

.about-access .left{
    width: auto;
}

.about-access .add{
    padding: 10px 0 0 0;
    font-size: 16px;
}

.about-access .tel{
    padding: 2px 0 0 0;
    font-size: 16px;
}

.about-access .map{
    margin: 20px 0 0 0;
}

.about-access .map iframe{
    height: 200px;
}
}

/*=========================================*/
/* about modal */
/*=========================================*/

.js-modal-open{
    cursor: pointer;
}

.modal{
    display: none;
    z-index: 99999999;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
}

.modal__bg{
    position: absolute;
    background: rgba(0,0,0,0.8);
    height: 100vh;
    width: 100%;
}

.modal__content{
  position: absolute;
    overflow: auto; 
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: min(calc(100% - 60px), 1020px);
  min-height: calc(30% - 60px);
  padding: 40px;
  background: #fff;
}

.modal__content.modal__kurumin{
  width: min(calc(100% - 60px), 700px);
  padding: 20px 0px 40px 0px;
}

a.js-modal-close{
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 22px;
    color: #000;
    text-decoration: none;
}

.modal-title {
    position: relative;
    font-size: 28px;
    font-weight: 600;
    line-height: 36px;
    color: #162393;
    text-align: center;
}

.modal-title::before {
    content: "";
    position: absolute;
    bottom: -15px;
    left: 50%;
    transform: translateX(-50%);
    width: 100px;
    height: 1px;
    background-color: #162393;
}

.modal-read {
    margin-top: 40px;
    font-size: 18px;
    font-weight: 500;
    line-height: 28px;
    text-align: center;
}

.modal-list {
    display: flex;
    flex-wrap:wrap; 
    gap: 20px;
    margin: 20px 0 0px 0;
}

.modal-list .box{
    max-width: calc(33.333% - 20px);
}

.modal-list img{
    width: 100%;
}

.modal-list .read{
    margin-top: 10px;
    font-size: 20px;
    font-weight: 500;
    line-height: 27px;
    text-align: center;
    color: #000;
}

.modal-list .text{
    margin-top: 5px;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    text-align: left;
}

.modal-iso{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 30px;
}

.modal-iso .img{
    width: 50%;
    text-align: center;
}

.modal-iso .img img{
    width: 100%;
    max-width: 500px;
    margin: auto;
}

.modal-iso .text-area{
    flex: 1;
}

.modal-iso .text{
    margin-bottom: 10px;
    font-size: 18px;
    font-weight: 500;
    line-height: 20px;
}

.modal-iso2{
    margin-top: 40px;
    margin-bottom: 30px;
}

.modal-iso2 .img{
    width: 100%;
    max-width: 900px;
    margin: auto;
    text-align: center;
}

.modal-iso2 .img img{
    width: 100%;
    margin: auto;
}

.modal-sdgs{
    display: flex;
    margin-top: 30px;
}

.modal-sdgs .img{
    width: 431;
    text-align: center;
}

.modal-sdgs .img img{
    width: 100%;
    max-width: 431px;
    margin: auto;
}

.modal-sdgs .text-area{
    flex: 1;
    margin-left: 40px;
}

.modal-sdgs .read{
    margin-bottom: 10px;
    font-size: 20px;
    font-weight: 600;
    line-height: 29px;
    color: #162393;
}

.modal-sdgs .text{
    margin-bottom: 15px;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
}

.modal-sdgs .icon-list{
    display: flex;
    flex-wrap:wrap; 
    gap: 14px;
    margin: 10px 0;
}

.modal-sdgs .icon-list li{
    width: 81px;
}

.modal-sdgs .icon-list img{
    width: 100%;
}

.img-kurumin{
    max-width: 600px;
    margin: auto;
}

.img-kurumin img{
    width: 100%;
}

.modal-soon {
    padding-top: 50px;
    font-size: 18px;
    line-height: 36px;
    text-align: center;
}

@media screen and (max-width:640px){
.modal__content{
  width: min(calc(90% - 20px), 1000px);
  height: calc(90% - 0px);
  padding: 20px;
}

.modal__content.modal__kurumin{
  width: min(calc(100% - 20px), 1000px);
  padding: 20px 0px 20px 0px;
}

a.js-modal-close{
    top: 10px;
    right: 10px;
}

.modal-title {
    font-size: 20px;
    line-height: 32px;
}

.modal-title::before {
    bottom: -15px;
    height: 2px;
}

.modal-read {
    margin-top: 30px;
    font-size: 14px;
    line-height: 24px;
}

.modal-list {
    display: block;
    margin: 20px 0 -30px 0;
}

.modal-list .box{
    max-width: 100%;
    margin-bottom: 30px;
}

.modal-list .read{
    margin-top: 10px;
    font-size: 18px;
    line-height: 25px;
}

.modal-list .text{
    font-size: 14px;
    line-height: 21px;
}

.modal-iso{
    display: block;
    margin-top: 30px;
}

.modal-iso .img{
    width: 100%;
}

.modal-iso .text-area{
    margin-top: 20px;
}

.modal-iso .text{
    font-size: 14px;
    line-height: 20px;
}

.modal-iso .text strong{
    display: block;
}

.modal-sdgs{
    display: block;
    margin-top: 30px;
}

.modal-sdgs .img{
    width: 431;
    margin: auto;
    text-align: center;
    margin-bottom: 20px;
}

.modal-sdgs .text-area{
    margin-left: 0px;
}

.modal-sdgs .read{
    margin-bottom: 10px;
    font-size: 18px;
    line-height: 24px;
    text-align: center;
}

.modal-sdgs .text{
    margin-bottom: 15px;
    font-size: 14px;
    line-height: 23px;
}

.modal-sdgs .icon-list{
    justify-content: center;
}
}

/*=========================================*/
/* works category */
/*=========================================*/

.work-list-category {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    text-align: center;
    gap: 30px;
    margin-top: 40px;
}

.work-list-category .box{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	background-position: center;
	background-repeat:no-repeat;
	background-size: cover;
    width: calc(33.333% - 30px);
    margin-bottom: 10px;
    height: 345px;
    text-align: center;
}

.work-list-category .box.category-road { background-image:url("images/works-cate-road.jpg");}
.work-list-category .box.category-bridge { background-image:url("images/works-cate-bridge.jpg");}
.work-list-category .box.category-river { background-image:url("images/works-cate-river.jpg");}
.work-list-category .box.category-pavement { background-image:url("images/works-cate-pavement.jpg");}
.work-list-category .box.category-others { background-image:url("images/works-cate-others.jpg");}

.work-list-category a{
    background-color: #000;
    color: #fff;
    text-decoration: none;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.work-list-category a:hover{
    opacity: 0.5;
	transition: all 0.5s;
}

.work-list-category .text{
    margin-top: auto;
    margin-bottom: auto;
    padding-top: 100px;
    font-size: 28px;
    line-height: 39px;
}

.work-list-category .btn {
    display: block;
    align-self: flex-end;
    margin-top: auto;
    width: calc(100% - 30px);
    height: 50px;
    margin: auto auto 15px auto;
    background-color: #fff;
    color: #000;
    text-decoration: none;
    text-align: center;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.work-list-category .btn:hover{
    opacity: 0.7;
	transition: all 0.5s;
}

.work-list-category .btn .ic{
    padding: 0 0 0 20px;
	background-image:url("images/icon-arrow.svg");
	background-position: left center;
	background-repeat:no-repeat;
	background-size: 11px;
    font-size: 16px;
    line-height: 50px;
}

.work-list-sub-title{
    padding: 20px 0 40px 0;
    color: #162393;
    text-align: center;
}

.work-list-sub-title .title{
    position: relative;
    padding: 0px 0 0px 0;
    font-size: 40px;
    font-weight: 600;
    line-height: 1;
}

.work-list-sub-title .title::before {
    content: "";
    position: absolute;
    bottom: -35px;
    left: 50%;
    transform: translateX(-50%);
    width: 48px;
    height: 8px;
    background-color: #162393;
}

@media screen and (max-width:1140px){
.work-list-category {
    flex-direction: column;
    gap: 0px;
    max-width: 345px;
    margin: 30px auto 0 auto;
}

.work-list-category .box{
    width: 100%;
    margin-bottom: 20px;
    height: auto;
}

.work-list-category .text{
    padding-top: 40px;
    padding-bottom: 30px;
    font-size: 20px;
    line-height: 32px;
}

.work-list-category .btn {
    width: calc(100% - 20px);
    height: 40px;
    margin: auto auto 10px auto;
}

.work-list-category .btn .ic{
    font-size: 15px;
    line-height: 40px;
}

.work-list-sub-title{
    padding: 5px 0 25px 0;
}

.work-list-sub-title .title{
    font-size: 24px;
}

.work-list-sub-title .title::before {
    bottom: -22px;
    width: 30px;
    height: 5px;
}
}

/*=========================================*/
/* works list */
/*=========================================*/

.work-list {
    padding-top: 45px;
}

.work-list-read {
    color: #162393;
    font-size: 46px;
    font-weight: 600;
    line-height: 60px;
    text-align: center;
}

.work-list-text {
    padding-top: 10px;
    font-size: 18px;
    font-weight: 500;
    line-height: 28px;
    text-align: center;
}

.work-list-navi {
    max-width: 785px;
    margin: 40px auto 0 auto;
}

.work-list-navi ul{
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    justify-content: center;  /* 横方向中央 */
}

.work-list-navi li{
    display: flex;
    justify-content: center;  /* 横方向中央 */
    align-items: center;      /* 縦方向中央 */
    text-align: center;
    width: calc(33.333% - 1px);
    border: solid 1px #162393;
    margin: -1px 0 0 -1px;
}

.work-list-navi a{
    display: block;
    width: 100%;
    padding: 15px;
    font-size: 18px;
    line-height: 28px;
    text-align: center;
    color:#162393;
    text-decoration: none;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.work-list-navi a:hover{
    opacity: 0.5;
	transition: all 0.5s;
}

.work-list-navi li.active a{
    background-color:#162393;
    color:#fff;
}

.work-list .list{
    display: flex;
    flex-wrap:wrap; 
    gap: 20px;
    margin-top: 50px;
}

.work-list .list .box{
    width: calc(33.333% - 20px);
    margin-bottom: 10px;
    background-color: #fff;
    border: solid 1px #162393;
}

.work-list .list a{
    display: block;
    color: #000;
    text-decoration: none;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.work-list .list a:hover{
    opacity: 0.7;
	transition: all 0.5s;
}

.work-list .list .img {
    position: relative;
    width: 100%;
    height: 212px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    background-color: #E6E6E6; /* 背景色（任意） */
    text-align: center;
}

.work-list .list .img img {
    max-width: 100%;
    max-height: 100%;
    height: auto;
    width: auto;
    margin: auto;
    object-fit: contain; /* 念のため入れてもOK */
}

.work-list .list .category{
    position: absolute;
    display: block;
    left: 0;
    bottom: 0;
    padding: 5px 20px;
    background-color: #162393;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
}

.work-list .list .text-area{
    display: block;
    padding: 15px 20px;
}

.work-list .list .title{
    display: block;
    font-size: 18px;
    font-weight: 600;
    line-height: 25px;
}

.work-list .list .data{
    display: flex;
    justify-content: space-between;
    padding: 10px 0px 0px 0px;
}

.work-list .list .order{
    font-size: 14px;
    font-weight: 500;
}

.work-list .list .day{
    font-size: 14px;
    font-weight: 500;
}

.work-list .noarticle{
    position: absolute;
    left: 50%;
    width: 300px;
    margin-left: -150px;
    padding: 0px 0 0 0;
    text-align: center;
}

.work-list .nav-links{
    margin-top: 15px;
    text-align: center;
}

.work-list .nav-links a{
    padding: 0 5px;
    margin: 0 5px;
}

@media screen and (max-width:1140px){
.work-list {
    padding-top: 30px;
}

.work-list-read {
    font-size: 24px;
    line-height: 30px;
}

.work-list-text {
    padding-top: 10px;
    font-size: 14px;
    line-height: 25px;
}

.work-list-navi {
    max-width: auto;
    margin: 20px auto 0 auto;
}

.work-list-navi li{
    width: calc(33.333% - 1px);
}

.work-list-navi a{
    padding: 8px;
    font-size: 12px;
    line-height: 20px;
}

.work-list .list{
    gap: 10px;
    margin-top: 30px;
	padding-bottom: 20px;
}

.work-list .list .box{
    width: calc(33.333% - 10px);
}
}

@media screen and (max-width:640px){
.work-list .list .box{
    width: calc(50% - 10px);
}

.work-list .list .img {
    height: 100px;
}

.work-list .list .category{
    padding: 4px 10px;
    font-size: 10px;
    line-height: 14px;
}

.work-list .list .text-area{
    padding: 5px 10px;
}

.work-list .list .title{
    font-size: 14px;
    line-height: 20px;
}

.work-list .list .data{
    flex-direction: column;
    padding: 10px 0px 5px 0px;
}

.work-list .list .order{
    font-size: 12px;
    line-height: 14px;
}

.work-list .list .day{
    font-size: 12px;
    line-height: 14px;
}
}

/*=========================================*/
/* works detail */
/*=========================================*/

.work-detail {
}

.work-detail .data-box{
}

.work-detail .data-box .category{
    display: inline-block;
    padding: 10px 20px;
    border: solid 1px #162393;
    font-size: 18px;
    font-weight: 500;
    color: #162393;
}

.work-detail .data-box .text-area{
    padding: 20px 0px 0px 0px;
}

.work-detail .data-box .title{
    font-size: 40px;
    font-weight: 600;
    line-height: 47px;
    color: #162393;
}

.work-detail .data-box .comments{
    padding: 20px 0px 0px 0px;
}

.work-detail .data-box .data{
    display: flex;
    justify-content: space-between;
    padding: 15px 0px 0px 0px;
}

.work-detail .data-box .order{
}

.work-detail .data-box .day{
    text-align: right;
}

.work-detail .img-box{
    padding: 30px 0px 0px 0px;
}

.work-detail .img-box img{
    max-width: 100%;
}

.work-detail .img-box-small {
    display: flex;
    flex-wrap: wrap;
    gap: 20px; /* 画像の間隔を20pxに */
    justify-content: flex-start; /* 左寄せ */
    margin-top: 20px;
}

.work-detail .img-box-small img {
    width: calc((100% - 20px) / 2); /* 2列なので幅の計算 */
    height: auto;
    display: block;
}

@media screen and (max-width:1140px){
.work-detail .data-box .category{
    padding: 10px 20px;
    font-size: 12px;
}

.work-detail .data-box .text-area{
    padding: 15px 0px 0px 0px;
}

.work-detail .data-box .title{
    font-size: 24px;
    line-height: 32px;
}

.work-detail .data-box .comments{
    padding: 15px 0px 0px 0px;
}

.work-detail .data-box .data{
    padding: 10px 0px 0px 0px;
}

.work-detail .img-box{
    padding: 15px 0px 0px 0px;
}
}

/*=========================================*/
/* news */
/*=========================================*/

.news-list {
    padding-top: 20px;
}

.news-list .list{
    display: flex;
    flex-wrap: wrap;
    padding: 25px 0px 0px 0px;
}

.news-list .list .box{
    max-width: calc(25% - 0px);
    margin-bottom: 30px;
}

.news-list .list a{
    display: block;
    border-left:solid 1px #162393;
    border-right:solid 1px #162393;
    padding: 0 13px;
    margin-left: -1px;
    color: #000;
    text-decoration: none;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.news-list .list .box:first-child a{
}

.news-list .list a:hover{
    opacity: 0.7;
	transition: all 0.5s;
}

.news-list .list .img{
}

.news-list .list .img img{
    width: 100%;
}

.news-list .list .category{
    margin-top: 12px;
    display: inline-block;
    padding: 5px 20px;
    background-color: #162393;
    font-size: 16px;
    font-weight: 500;
    color: #fff;
}

.news-list .list .title{
    display: block;
    margin-top: 12px;
    font-size: 18px;
    font-weight: 500;
    line-height: 25px;
}

.news-list .list .day{
    display: block;
    margin-top: 17px;
    padding: 0 28px 0 0;
	background-image:url("images/icon-arrow4.svg");
	background-position: right center;
	background-repeat:no-repeat;
	background-size: 18px;
    font-size: 16px;
    font-weight: 500;
}

@media screen and (max-width:1140px){
.news-list .list .box{
    max-width: calc(33.333% - 0px);
}
}

@media screen and (max-width:800px){
.news-list {
    padding-top: 0px;
}

.news-list .list{
    flex-direction: column;
    padding: 25px 0px 10px 0px;
}

.news-list .list .box{
    max-width: calc(100%);
    margin-bottom: 0px;
}

.news-list .list a{
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    border-left:none;
    border-right:none;
    border-bottom:solid 1px #162393;
    margin-left: auto;
    padding: 10px 0px;
}

.news-list .list .box:first-child a{
    border-top:solid 1px #162393;
    border-left: none;
}

.news-list .list .img{
    width: 195px;
    margin-right: 10px;
}

.news-list .list .data{
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.news-list .list .category{
    margin-top: 0;
    padding: 0px 10px 2px 10px;
    width: auto;
    font-size: 12px;
}

.news-list .list .title{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-top: 5px;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
}

.news-list .list .day{
    margin-top: auto;
    padding: 0 0px 0 0;
    width: 100%;
	background-size: 14px;
    font-size: 12px;
    font-weight: 500;
}
}

@media screen and (max-width:640px){
.news-list .list{
    margin: 0 0px 0px 0px;
}
}

/*=========================================*/
/* news detail */
/*=========================================*/

.news-detail {
}

.news-detail .data-box{
}

.news-detail .data-box .category{
    display: inline-block;
    padding: 10px 20px;
    border: solid 1px #162393;
    font-size: 18px;
    font-weight: 500;
    color: #162393;
}

.news-detail .data-box .text-area{
    padding: 20px 0px 0px 0px;
}

.news-detail .data-box .title{
    font-size: 40px;
    font-weight: 600;
    line-height: 47px;
    color: #162393;
}

.news-detail .data-box .comments{
    padding: 20px 0px 0px 0px;
}

.news-detail .data-box .data{
    display: flex;
    justify-content: space-between;
    padding: 15px 0px 0px 0px;
}

.news-detail .data-box .order{
}

.news-detail .data-box .day{
    text-align: right;
}

.news-detail .img-box{
    padding: 30px 0px 0px 0px;
}

.news-detail .img-box img{
    max-width: 100%;
}

.news-detail .btn-back{
    padding: 80px 0 0 0;
}

.news-detail .btn-back a{
    display: block;
    width: 300px;
    height: 50px;
    margin: auto;
    background-color: #1a1a1a;
    color: #fff;
    text-decoration: none;
    text-align: center;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;
	transition: all 0.5s;
}

.news-detail .btn-back a:hover{
    opacity: 0.7;
	transition: all 0.5s;
}

.news-detail .btn-back .ic{
    padding: 0 0 0 20px;
	background-image:url("images/icon-arrow3.svg");
	background-position: left center;
	background-repeat:no-repeat;
	background-size: 11px;
    font-size: 16px;
    line-height: 50px;
}

@media screen and (max-width:1140px){
.news-detail .data-box .category{
    padding: 10px 20px;
    font-size: 12px;
}

.news-detail .data-box .text-area{
    padding: 15px 0px 0px 0px;
}

.news-detail .data-box .title{
    font-size: 24px;
    line-height: 32px;
}

.news-detail .data-box .comments{
    padding: 15px 0px 0px 0px;
}

.news-detail .data-box .data{
    padding: 10px 0px 0px 0px;
}

.news-detail .img-box{
    padding: 15px 0px 0px 0px;
}

.news-detail .btn-back{
    padding: 30px 0 0 0;
}

.news-detail .btn-back a{
    width: 220px;
    height: 37px;
    margin: auto;
}

.news-detail .btn-back .ic{
    padding: 0 0 0 15px;
	background-size: 6px;
    font-size: 14px;
    line-height: 37px;
}
}

/*=========================================*/
/* privacy */
/*=========================================*/

.privacy-read{
    padding: 60px 0;
    font-size: 17px;
    text-align: center;
}

.privacy-list{
    padding: 0px 0 50px 0;
    font-size: 17px;
}

.privacy-list .box{
	display: -webkit-flex;
	display: flex;
    align-items: stretch;
    width: 100%;
    border-bottom: solid 1px #162393;
}

.privacy-list .left{
    width: 300px;
    margin-right: 15px;
    padding: 30px 0;
    font-weight: 600;
}

.privacy-list .right{
    flex: 1;
    padding: 30px 0;
}

.privacy-list .box:first-child{
    border-top: solid 1px #162393;
}

@media screen and (max-width:1140px){
.privacy-read{
    padding: 30px 0;
    font-size: 14px;
}

.privacy-list{
    padding: 0px 0 15px 0;
    font-size: 14px;
}

.privacy-list .box{
	display: block;
}

.privacy-list .left{
    width: auto;
    margin-right: 0px;
    padding: 15px 0 0 0;
}

.privacy-list .right{
    padding: 8px 0 20px 0;
}

.privacy-list .box:first-child {
    border-top: solid 1px #162393;
}
}

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

.contact-form{
    max-width: 800px;
	margin: 0px auto 40px auto;
}

.contact-read {
    padding: 60px 0;
    font-size: 17px;
    text-align: center;
}

.contact-list{
    border-top: solid 1px #162393;
    max-width: 800px;
	margin: 0px auto 40px auto;
}

.contact-list .box{
    border-bottom: solid 1px #162393;
	list-style: none;
	overflow: hidden;
}

.contact-list .left{
	position: absolute;
	color:#000000;
	font-size:18px;
	font-weight: 500;
	letter-spacing: 0.02em;
	padding: 30px 0px 0px 0px;
}

.required {
	margin-left: 15px;
	padding:6px 12px 8px 12px;
	color:#ffffff;
	font-size:14px;
	font-weight: 500;
	line-height:100%;
	background-color: #D10003;
	letter-spacing:0.05em;
	border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}

.contact-list .right{
	padding: 20px 0px 20px 300px;
	display: block;
}

.contact-list .right input{
	border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
	background-color: #ffffff;
	border: 1px solid rgba(0,0,0,0.2);
	padding: 12px 10px;
    width: calc(100% - 22px);
	-webkit-transition: opacity 1.0s ease-out;
	-moz-transition: opacity 1.0s ease-out;
	-ms-transition: opacity 1.0s ease-out;
	transition: opacity 1.0s ease-out;
	transition: all 1.5s;
}

.contact-list .right input:hover {
	border: 1px solid rgba(0,0,0,1.0);
	transition: all 0.5s;
}

.contact-list .right input:focus {
	border: 1px solid #317edb;
}

.contact-list .right textarea{
	border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
	background-color: #ffffff;
	border: 1px solid rgba(0,0,0,0.2);
	padding: 12px 10px;
    width: calc(100% - 22px);
	-webkit-transition: opacity 1.0s ease-out;
	-moz-transition: opacity 1.0s ease-out;
	-ms-transition: opacity 1.0s ease-out;
	transition: opacity 1.0s ease-out;
	transition: all 1.5s;
}

.contact-list .right textarea:hover {
	border: 1px solid rgba(0,0,0,1.0);
	transition: all 0.5s;
}

.contact-list .right textarea:focus {
	border: 1px solid #317edb;
}

.contact-list .right .radio_area{
	margin-right: 20px;
}

.contact-list .right .caution{
	margin-left: 10px;
	font-size: 13px;
}

.contact-form-btn{
	width:100%;
	padding:10px 0 0px 0;
	margin:0 auto;
	text-align: center;
}

.contact-form-btn .btn{
	margin: 0px 10px 0 10px;
	text-align: center;
	border-radius: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
}

.contact-form-btn .btn a{
	cursor: pointer;
	font-size:16px;
	font-weight: normal;
	letter-spacing: 0.06em;
	color: #ffffff;
	text-decoration: none;
	display: block;
	width: 100%;
    max-width: 300px;
    margin: auto;
	padding: 19px 0 20px 0;
	border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
	box-shadow: 0 0px 6px rgba(0,0,0,0.0);
	background-color: #1163B1;
	-webkit-transition: opacity 1.0s ease-out;
	-moz-transition: opacity 1.0s ease-out;
	-ms-transition: opacity 1.0s ease-out;
	transition: opacity 1.0s ease-out;
	transition: all 1.5s;
}

.contact-form-btn .btn a:hover {
	box-shadow: 0 0px 12px rgba(0,0,0,0.0);
	background-color: #003d72;
	transition: all 0.5s;
}

.contact-form-btn .btn input{
	font-size:18px;
	color: #ffffff;
	letter-spacing: 0.00em;
	text-align: center;
	width: 100%;
	cursor: pointer;
	display: block;
    max-width: 300px;
    margin: auto;
	padding: 19px 0 20px 0;
	background-color: #162393;
	border: 1px solid #162393;
	transition: all 0.5s;
}

.contact-form-btn .btn input:hover {
	background: #000;
	border: 1px solid #000;
	transition: all 0.5s;
}

.contact-form-btn p{
	padding-top: 30px;
	color:#333333;
}

/* エラーメッセージ */
.contact-form .wpcf7 form.invalid .wpcf7-response-output,
.contact-form .wpcf7 form.unaccepted .wpcf7-response-output,
.contact-form .wpcf7 form.payment-required .wpcf7-response-output {
    text-align: center;
    color: #b72039;
    border-color: #b72039;
}

/* 成功メッセージ */
.contact-form .wpcf7 form.sent .wpcf7-response-output {
    text-align: center;
    color: #2083b6;
    border-color: #2083b6;
}

@media screen and (max-width:1140px){
.contact-read{
    padding: 30px 0;
    font-size: 14px;
}

.contact-list{
	margin: 0px 0px 30px 0px;
}

.contact-list .left{
	position: relative;
	padding: 18px 0px 0px 0px;
    font-size: 16px;
}

.required {
	margin-left: 10px;
	padding:4px 10px 5px 10px;
	font-size:14px;
}

.contact-list .right{
	padding: 15px 0px 20px 0px;
    font-size: 14px;
}

.contact-list .right .caution{
	margin-left: 0px;
	padding-top: 5px;
	display: block;
}

.contact-form-btn{
    width: auto;
	padding:0px 0px 0px 0px;
}

.contact-form-btn .btn{
	margin: 0px 0px 0 0px;
	text-align: center;
	border-radius: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
}

.contact-form-btn .btn a{
	padding: 15px 0 16px 0;
}

.contact-form-btn .btn input{
    max-width: 100%;
	padding: 16px 0 16px 0;
	background-color: #162393;
    font-size: 16px;
}

.contact-form-btn .btn input:hover {
	background: #000;
}
}

@media screen and (max-width:840px){
.contact-form{
    margin: 0 20px 20px 20px;
}
}