@charset "UTF-8";
/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
body{
	margin-top:-16px;
}
.article h2{
	background-color: transparent;
}
.article h3 {
	border-left: none;
    border-right: none;
    border-top: none;
	border-bottom: none;
}
.article ul li{
	margin: 0em;
}
.article dd {
	margin-left: 0;}
header{
  width: 100%;
  padding: 1em 2em 2em;
	position: absolute;
	z-index: 99;
}
header.HeightMin{
	padding: 1em;
	position: fixed;
    z-index: 999;/*最前面へ*/
	animation: DownAnime 0.5s forwards;
	background: #fff;
}
header.HeightMin h1{
	display: none;
}
@keyframes DownAnime{
  from {
  	opacity: 0;
	transform: translateY(-170px);
  }
  to {
  	opacity: 1;
	transform: translateY(0);
  }
}
a{
	text-decoration: none;
}
p{
	line-height: 1.9;
	letter-spacing: 0.1em;
	text-indent: -0.1em;
}
.pc_none{display:none;}
.sp_none{display:block;}
.pnone p{
	display: none;
}
.page .author-info{
	display: none;
}
.entry-content>* {
	margin-bottom:0;
}
.body .article{
	margin-bottom: 0;
}
header h1{
  text-align: center;
  font-size: 12px;
  color: #1575ce;
}
.head-rogo{
  text-align: center;
  padding: 10px;
  width: 30%;
  max-width: 200px;
  margin: 0 auto;
}
.head-rogo img{
  width: 100%;
  height: auto;
}
.g-nav ul{
  box-sizing: border-box;
  margin: 0;
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  list-style: none;
  padding: 20px;
  display: flex;
  justify-content: space-between;
  border-radius: 80px;
  height: 80px;
  line-height: 40px;
  background: linear-gradient(#1576cf, #1742b5);
  }
.g-nav a{
  color: #fff;
  }
.HeightMin .g-nav ul{
  padding: 10px 20px;	
  height: 40px;
  line-height: 20px;
}
.HeightMin .head-rogo{
  padding: 0 0 10px;
  max-width: 120px;
}

.g-nav ul li{
  width: calc(100% / 6);
  border-left: rgba(255,255,255,0.5) 1px solid;
  text-align: center;
  }
.g-nav ul li:first-child{
  border-left: none;
  }
.ttl_wrap{
	background-image: url(https://amami-fukuoka.com/wp-content/themes/cocoon-child-master/image/ttl_bg.jpg);
	background-size: cover;
	width: 100%;
	height: 520px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.ttl_wrap p{
	padding: 2.3em 0 0;
	font-weight: bold;
	color: #1647b7;
	font-size: 48px;
	margin-bottom: 0;
	text-align: center;
	letter-spacing: 0;
	text-indent: 0;
	text-shadow:2px 2px 0 #FFF, -2px -2px 0 #FFF,
              -2px 2px 0 #FFF, 2px -2px 0 #FFF,
              0px 2px 0 #FFF,  0 -2px 0 #FFF,
              -2px 0 0 #FFF, 2px 0 0 #FFF;
}
.ttl_wrap h1{
	letter-spacing: 0.1em;
	text-indent: -0.1em;
	color: #1647b7;
	font-size: 20px;
	text-align: center;
	letter-spacing: 0.1em;
	text-indent: 0.1em;
	text-shadow:1px 1px 0 #FFF, -1px -1px 0 #FFF,
              -1px 1px 0 #FFF, 1px -1px 0 #FFF,
              0px 1px 0 #FFF,  0-1px 0 #FFF,
              -1px 0 0 #FFF, 1px 0 0 #FFF;
}
.bg_lblue{
	background-color: #e4ecf3;
}
.bg_lg{
	background-color: #eeeeee;
}
.bg_area{
	background-color: #b3e0f3;
}
.bg_border{
	background-image: url(https://amami-fukuoka.com/wp-content/themes/cocoon-child-master/image/home/bg_border.png);
	background-size: cover;
}

 .full_img{
    width: 100%;
    max-width: 1920px;
    margin-left: auto;
    margin-right: auto;
  }
  .full_img img{
    width: 100%;
    height: auto;
  }
.mrb1em{margin-bottom: 1em!important;}
.mrb2em{margin-bottom: 2em!important;}
.mw_760{
	max-width: 760px;
    margin-left: auto;
    margin-right: auto;
}
.mw_1000{
	max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.pd_nomal{
	padding-top: 80px;
	padding-bottom: 80px;
}
.pd_small{
	padding-top: 60px;
	padding-bottom: 60px;
}
.txt_l{
    font-size: 1.2em;
    font-weight: bold;
  }
.btn,
a.btn{
  text-align: center;
  font-weight: bold;
  letter-spacing: 0.2em;
  text-indent: 0.2em;
  display: block;
  padding: 20px;
  width: 260px;
  color: #121d42;
  background-color: #fac60b;
  border-radius: 100vh;
  margin-left: auto;
  margin-right: auto;
}
.btn:hover,
a.btn:hover{
  color: #121d42;
  background: #fad652;
}
.btn-blue,
a.btn-blue{
  color: #121d42;
  background: #00acf3;
}
.btn-blue:hover,
a.btn-blue:hover{
  color: #121d42;
  background: #51c4f3;
}
.btn-old,
a.btn-old{
	width: 460px;
  color: #fff;
  background: #e13d3d;
}
.btn-old:hover,
a.btn-old:hover{
	color: #fff;
  background: #e15d5d;}
.btn-out,
a.btn-out{
width: 460px;
  color: #fff;
  background: #33be3a;
}
.btn-out:hover,
a.btn-out:hover{
	color: #fff;
  background: #e15d5d;
}
.btn-out br,
a.btn-out br,
.btn-old br,
a.btn-old br{
	display: none;
}
.col3-wrap_b h3{
		border-left: none!important;
	}
.h2_wrap{
	text-align: center;
	margin-bottom: 1.8em;
}
.h2_wrap h2{
	font-size: 32px;
	text-align: center;
	margin-bottom: 0;
	color: #121d42;
	letter-spacing: 0.1em;
	text-indent: -0.1em;
}
.nametag{
	display: inline-block;
	padding: 5px 2em;
	background: #1742b5;
	color: #fff;
	font-size: 18px;
	font-weight: bold;
	border-radius: 100px;
	min-width: 200px;
	margin: 0 auto 2em;
}
.h2_wrap p{
display: inline-block;
position: relative;
	color: #121d42;
	letter-spacing: 0.1em;
	text-indent: -0.1em;
}
.h2_wrap p:before{display: inline-block!important;position: absolute!important;content: ''!important;
  bottom: -10px;
  left: 50%;
  width: 30px;  height: 4px;
  -moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translate(-50%);
	background-color: #121d42;
}
#sec2{
    width: 100%;
    padding: 120px 20px;
    background-image: url(https://amami-fukuoka.com/wp-content/themes/cocoon-child-master/image/home/sec2_bg.jpg);
    background-size: cover;
    background-position: bottom center;
  }
  .center_txt{
    text-align: center;
  }
.col4-wrap{
  width: 100%;
  max-width: 1140px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
}
.col4-wrap div{
  width: calc(100% / 4);
  padding: 20px;
}
.col4-wrap div p{
	display: none;
}
.col4-wrap div img{
  width: 100%;
  height: auto;
}
.col4-wrap div h3{
  width: 100%;
  text-align: center;
}
.col2-wrap{
  width: 100%;
  max-width: 1800px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
}
.col2-wrap_rr{
  flex-direction: row-reverse;
}
.col2-img{
  width: 50%;
}
.col2-img img{
  width: 100%;
  height: auto;
}
.col2-txt{
  width: 50%;
}
.col2-txt_inner{
  width: 100%;
  max-width: 620px;
  padding: 60px;
}
.col2-txt_inner h2{
  width: 100%;
  max-width: 620px;
  padding: 0px 10px 0;
  border-left: 10px solid #00acf3;
	margin-bottom: 0.5em;
}
.col2-wrap_b,
.col3-wrap_b{
  width: 100%;
  max-width: 1140px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  list-style: none;
  padding: 0;
  flex-wrap: wrap;
}
.article .col2-wrap_b li{
  width: calc((100% / 2) - 60px);
  margin: 30px;
  padding: 26px;
  background-color: #e4ecf3; 
}
.col2-wrap_b li img{
  width: 100%;
  height: auto;
}
.col2-wrap_b li h3{
  padding: 0px 10px 0;
  border-left: 8px solid #00acf3;
}
.col2-wrap_b li p{
}
.article .col3-wrap_b li{
  width:  calc((100% / 3) - 36px);
  margin: 18px;
  padding: 18px;
  background-color: #fff; 
	position:relative;
}
.col3-wrap_b li img{
  width: 100%;
  height: auto;
}
.col3-wrap_b li h3{
  padding: 0px;
}
.col3-wrap_b li h3.lineup_name{
padding: 0px 10px 0;
border-left: none!important;
text-align: center;
position: relative;
display: flex;
width: 100%;
justify-content: space-between;
}
.col3-wrap_b li h3.lineup_name:before{
	content: '［';
}
.col3-wrap_b li h3.lineup_name:after{
	content: '］';
}
.tag{
width: 90px;
text-align: center;
padding: 2px;
color: #fff;
font-size: 10px!important;
margin-top: 16px;
margin-bottom: 5px!important;
  }
.out_color{
  background: #33be3a;
}
.old_color{
  background: #e13d3d;
}
.price{
	font-size: 16px!important;
	font-weight: bold;
    text-align: right;
    color: #9d0909;
  }
.area_wrap{
	width: 100%;
	text-align: center;
	padding: 80px 20px;
}
ul.acc_list{
	list-style: none;
	width: 100%;
	padding: 20px 0  0;
}
ul.acc_list li{
	display: flex;
}
ul.acc_list li span{
	width: 6em;
}
ul.ex_image{
	width: 100%;
	max-width: 1200px;
	margin: 0 auto 80px;
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	padding: 0;
}
ul.ex_image li{
	width: 50%;
	padding: 0 5px;
}
ul.ex_image li img{
	width: 100%;
	height: auto;
}

/*---------------------------------
アコーディオンボックス
--------------------------------*/
.acbox{
  width: auto;
  font-size:0px; /* ラベルと開く部分を分離する時は数値を入れる */
  margin:0 10px; /* ボックス全体の位置調整 */
}
.acbox label{
  width: auto;
  font-size: 18px;
  font-weight: bold;
  background: #fff;
  position: relative;
  display: block;
  padding:1em 3em;
	border-radius: 100px;
  cursor: pointer;
	color: #000;
	border: 4px solid #000;
}
.acbox label:hover{
  background: #fff; /* ラベルにマウスを乗せた時の背景色 */
}
.acbox input{
  display: none;
}
.acbox label:after{
	font-size: 20px;
  color: #000;
  content:"+"; /* ラベルのアイコン */
  position: absolute;
  top: 50%;
  right: 45px;
  margin-top: -14px;
}
.acbox input:checked ~ label::after {
  content:"-"; /* ラベルをクリックした後のアイコン */
}
.acbox div{
  height: 0px;
  overflow: hidden;
  opacity: 0;
  transition: 0.15s; /* 開閉スピードの設定 */
}
.acbox input:checked ~ div{
  height: auto;
  padding: 18px; /* 開いた部分の枠内の余白 */
  border-radius: 0px;
  background: #F3F4F5; /* 開いた部分の背景色 */
  opacity: 1;
}
.acbox input:checked ~ label {
  background: #fff; /* クリック後のラベルの背景色 */
}
.acbox-under{
	 width: auto;
  font-size: 18px;
  font-weight: bold;
  background: #fff;
  position: relative;
  display: block;
  padding:1em 3em;
	border-radius: 100px;
  cursor: pointer;
	color: #000;
	margin-bottom: 1em;
  font-size: 16px; /* 開いた部分の文字サイズ */
  color: #555555; /* 開いた部分の文字色 */
}
.flow_list{
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	list-style: none;
}
.flow_list li{
	text-align: center;
}
.flow_list li.flow_item{
  width: auto;
  font-size: 20px;
  font-weight: bold;
  background: #fff;
  position: relative;
  display: block;
  padding:1em 3em;
	border-radius: 100px;
  cursor: pointer;
	color: #000;
	border: 4px solid #000;
	margin-bottom: 1em;
}
/************************************
** mailform
************************************/
.main_bg{
	width: 100%;
	height: 100vh;
	background-image: url(https://amami-fukuoka.com/wp-content/themes/cocoon-child-master/image/home/main_bg.jpg);
	background-size: cover;
	background-position: center;
	display: flex;
	justify-content: center;
	align-items: center;
}
/************************************
** mailform
************************************/
.form_area{
	width: 100%;
	padding: 60px 20px;
	background: #e4ecf3;
}
.form_area dl{
	width: 100%;
	max-width: 1000px;
	display: flex;
	margin: 0 auto;
}
.form_area dl dt{
	width: 16em;
	font-weight: bold;
}
.form_area dl dt span{
	font-size:10px;
	font-weight: nomal;
	color:#de0909;
}

.form_area dl dd{
	width: calc(100% - 10em);
}
input[type="text"],input[type="tel"],input[type="email"]{
	border-radius: 100px;
}
input[type="submit"]{
	border-radius: 100px;
	background-color: #fac60b;
	width: 300px;
	margin: 0 auto;
	display: block;
}
/************************************
** COMAPNY
************************************/
ul.rinen{
}
ul..rinen li{
	margin-bottom: 1em;
}
.history dl{
	width: 100%;
	max-width: 800px;
	display: flex;
	margin: 0 auto;
	margin-bottom: 1em;
}
.history dl dt{
	width: 6em;
	font-weight: bold;
}
.history dl dd{
	width: calc(100% - 6em);
}
.company_list th{
	background: #e4ecf3;
	padding: 16px;
}
.company_list td{
	background: #ffffff;
	padding: 16px;
}
.work_block{
	display: flex;
	width: 100%;
	max-width: 1000px;
	padding: 40px;
	border-radius: 20px;
	background: #fff;
	margin: 0 auto 80px;
}
.work_block img{
	padding: 0 20px 0 0;
}
/************************************
** footer
************************************/
.foot-fixed{
color: #fff;
position: fixed;
bottom: 0;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
background: linear-gradient(to bottom right,#1742b5, #121d42);
padding: 14px;
display: none;
  }
.foot-fixed p{
  text-align: center;
  margin: 0;
  }
.foot-fixed h2{
  text-align: center;
  margin: 0;
  padding: 0;
  }
.ff_right{
    display: flex;
    align-items: center;
  }
.ff_right a{
  padding: 0 5px;
  }
.ff_left,
.ff_right{
  padding: 0 20px;
  }
.foot-contact{
  color: #fff;
  width: 100%;
  background: linear-gradient(#1642e2, #101b9c);
  padding: 60px 20px 40px;   
}
.foot-contact div,
.foot-contact h2{
  text-align: center;
  width: 100%;
  margin-bottom: 28px;
}
.foot-nav{
width: 100%;
background-color: #e4ecf3;
}
.foot-nav ul{
  box-sizing: border-box;
  margin: 0;
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  list-style: none;
  padding: 20px;
  display: flex;
  justify-content: space-between;
  height: 80px;
  line-height: 40px;
  }
.foot-nav a{
  color: #000;
  }
.foot-nav ul li{
  width: calc(100% / 6);
  text-align: center;
  }
.foot-info{
  padding: 60px 0;
  }
.foot-info h2,
.foot-info p,
.foot-info div{
    text-align: center;
  }
.foot-info br{
	display: none;
  }
footer{
  box-sizing: border-box;
  }
footer small{
  display: block;
  width: 100%;
  padding: 10px 0;
  background-color: #e4ecf3;
  text-align: center;
  }
.foot-rogo{
  text-align: center;
  padding: 10px;
  width: 30%;
  max-width: 200px;
  margin: 0 auto;
}
.foot-rogo img{
  width: 100%;
  height: auto;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
	.g-nav{
		display: none;
	}
#sec2{
    padding: 60px 10px;
  }
.col4-wrap{
	flex-wrap: wrap;
}
.col4-wrap div{
  width: calc(100% / 2);
  padding: 10px;
}
.col4-wrap div h3{
	font-size: 14px;
	margin: 0;
}
.col2-wrap{
  margin: 0 auto;
  flex-direction: column;
}
.col2-img,
.col2-txt{
  width: 100%;
}
.col2-txt_inner{
  padding: 10px;
}
.article .col2-wrap_b li{
  width: 100%;
  margin: 10px 24px;
  padding: 26px;
  background-color: #e4ecf3; 
}
.article .col3-wrap_b li{
  width: 100%;
  margin: 10px 24px;
  padding: 12px;
}
	.btn_wrap{
		padding: 0 24px;
	}
	.center_txt {
		padding: 0 20px;
	}
	.txt_l{
		font-size: 1.1em;
		line-height: 1.65;
	}
}

/*834px以下*/
@media screen and (max-width: 834px){
	.HeightMin{
		display: none;
	}
.pc_none{display:block;}
.sp_none{display:none;}
.main_bg{
	width: 100%;
	height: 80vh;
	background-image: url(https://amami-fukuoka.com/wp-content/themes/cocoon-child-master/image/home/main_bg_sp.jpg);
}
.main_bg div{
	text-align: center;
}	
.main_bg img{
	width: 80%;
	height: auto;
}	
header{
	position: absolute;
	z-index: 0;
}
	.head-rogo{
		display: none;
	}
.ttl_wrap{
	height: 200px;
}
.ttl_wrap p{
	font-size: 32px;
}
.ttl_wrap h1{
	font-size: 16px;
}

.btn-blue,
a.btn-blue{
	padding: 10px;
	width: 100%;
	font-size: 11px;
	letter-spacing: 0;
}
.btn-old,
a.btn-old{
	width: 100%;
  color: #fff;
  background: #e13d3d;
}
.btn-out,
a.btn-out{
width: 100%;
  color: #fff;
  background: #33be3a;
}
.btn-out br,
a.btn-out br,
.btn-old br,
a.btn-old br{
	display: block;
}
.pd_nomal{
	padding: 42px 24px;
}
.pd_small{
	padding: 32px 24px;
}
	.pd-lr_none{
		padding-left: 0;
		padding-right: 0;
	}
.h2_wrap h2{
	padding: 0;
	font-size: 19px;
}
.article h3 {
    font-size: 16px;
}
.col3-wrap_b li h3.lineup_name{
	font-size: 12px;
	margin-bottom: 0;
}
.article h3{
		margin: 0.5em 0;
	}
.nametag{
	font-size: 16px;
	width: 160px;
}
.flow_list li.flow_item{
  font-size: 16px;
  padding:1em 2em;
	border-radius: 100px;
	border: 2px solid #000;
}
.form_area dl{
	flex-direction: column;
}
.form_area dl dt,.form_area dl dd{
	width:100%;
}
.acbox label{
  font-size: 16px;
  padding:1em 2em;
	border: 2px solid #000;
}
.acbox label:after{
	font-size: 16px;
}
.acbox label:after{
 right: 15px;
}
.work_block{
	flex-direction: column;
	padding: 26px;
	border-radius: 20px;
	background: #fff;
	margin: 0 auto 40px;
}
.work_block img{
	padding: 0;
}
ul.ex_image li{
	width: 100%;
	padding: 0 16px;
}
/************************************
** COMAPNY
************************************/
.history dl{
	flex-direction: column;
}
.history dl dt,
.history dl dd{
width:100%;
	}
.company_list th,.company_list td{
	display: block;
	width: 100%;
}

/************************************
** footer
************************************/
.foot-fixed{
	display: flex;
	flex-direction: column;
	padding: 10px 0;
  }
.foot-fixed p{
  text-align: center;
  margin: 0;
  }
.foot-fixed h2{
	font-size: 14px;
	margin-bottom: 2px;
  }
.ff_right{
    display: flex;
    align-items: center;
  }
.ff_right a{
  padding: 0 5px;
  }
.ff_left,
.ff_right{
  padding: 0 20px;
  }
.foot-contact{
  color: #fff;
  width: 100%;
  background: linear-gradient(#1642e2, #101b9c);
  padding: 60px 20px 40px;   
}
.foot-contact div,
.foot-contact h2{
  text-align: center;
  width: 100%;
  margin-bottom: 28px;
}
.foot-nav{
width: 100%;
background-color: #e4ecf3;
}
.foot-nav ul{
  box-sizing: border-box;
  margin: 0;
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  list-style: none;
  padding: 20px;
	flex-wrap: wrap;
  justify-content: space-between;
  height: auto;
  line-height: 40px;
	flex-direction: column;
  }
.foot-nav ul li{
  width: 100%;
  text-align: center;
  }
.foot-info{
  padding: 30px 24px;
  }
.foot-info br{
	display: block;
  }
.foot-info h2{
	font-size: 18px;
  }
footer small{
  display: block;
  width: 100%;
  padding: 10px 0 120px;
  background-color: #e4ecf3;
  text-align: center;
  }
}
/*480px以下*/
@media screen and (max-width: 480px){
.entry-title,
  .article h2 {
    font-size: 19px;
    padding: 0.6em 0.8em;
  }
.col3-wrap_b li p{
	font-size: 12px;
}
}
@media screen and (max-width: 834px) {
    .article ul{
        padding-left: 0;
    }
}
.menu-content {
	background: linear-gradient(#1642e2, #101b9c);
}
.menu-drawer a {
    color: #fff;
    text-decoration: none;
    padding: 20px 12px;
    display: block;
}
.menu-close-button {
	color:#fff;
}
.center_img{
	width:100%;
	text-align:center;
}
.center_img img{
	width:100%;
	max-width:800px;
}
.box-child-btn{
	width:100%;
	bottom:10px;
}
.box-child-text{
	height:8em;
}
@media screen and (max-width: 834px) {
.box-child-text{
	height:auto;
}	
}
.news_wrap {list-style:none;}
.news_wrap li{padding: 1em 0.5em; background:none; border-bottom:1px solid #333; width:100%;}
.news_wrap li a{text-decoration:none; color:#414141; display:flex; justify-content:flex-start;}
.news_wrap li a span:first-child{width:9em; margin-right:0;}
.news_wrap li a span:last-child{width:calc(100% - 9em); margin-right:0;}

/* =========================================
   設置事例 一覧
========================================= */

.case_archive {
  padding: 4rem 0 6rem;
  background: #fff;
}

.case_archive_container {
  width: calc(100% - 40px);
  max-width: 1106px;
  margin: 0 auto;
}


/* 導入文
----------------------------------------- */

.case_archive_intro {
  margin-bottom: 3rem;
  text-align: center;
}

.case_archive_intro h2 {
  margin: 0 0 1rem;
  font-size: 1.75rem;
  line-height: 1.5;
  font-weight: 700;
  color: #1f1f1f;
}

.case_archive_intro p {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.9;
  color: #555;
}


/* 一覧
----------------------------------------- */

.case_list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 52px 32px;
  margin: 0;
  padding: 0;
  list-style: none;
}


/* カード
----------------------------------------- */

.case_card {
  margin: 0;
}

.case_card > a {
  display: block;
  height: 100%;
  color: #1f1f1f;
  text-decoration: none;
}

.case_card_image {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
  margin-bottom: 1.1rem;
  overflow: hidden;
  background-color: #f5f5f5;
}

.case_card_image img {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  margin: 0;
  object-fit: cover;
  transform: translate(-50%, -50%);
  transition: transform 0.35s ease;
}

.case_card > a:hover .case_card_image img {
  transform:
    translate(-50%, -50%)
    scale(1.04);
}


/* カード内容
----------------------------------------- */

.case_card_body {
  padding: 0 0.25rem;
}

.case_card_location {
  margin: 0 0 0.5rem;
  font-size: 0.8rem;
  line-height: 1.5;
  color: #666;
}

.case_card_title {
  margin: 0 0 0.8rem;
  font-size: 1.2rem;
  line-height: 1.6;
  font-weight: 700;
  color: #1f1f1f;
}

.case_card_date {
  margin: 0;
  font-size: 0.8rem;
  line-height: 1.5;
  color: #666;
}


/* 詳細を見る
----------------------------------------- */

.case_card_more {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 1.25rem;
  padding: 0.8rem 1rem;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  font-size: 0.85rem;
  font-weight: 700;
  color: #1647b7;
}

.case_card_more::after {
  content: "→";
  font-size: 1rem;
}


/* ページ送り
----------------------------------------- */

.case_pagination {
  margin-top: 5rem;
}

.case_pagination .nav-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
}

.case_pagination .page-numbers {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 10px;
  border: 1px solid #1647b7;
  color: #1647b7;
  text-decoration: none;
}

.case_pagination .page-numbers.current {
  background-color: #1647b7;
  color: #fff;
}


/* 0件
----------------------------------------- */

.case_empty {
  text-align: center;
  font-size: 1rem;
}


/* =========================================
   Tablet
========================================= */

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

  .case_list {
    grid-template-columns: repeat(2, 1fr);
    gap: 40px 24px;
  }
}


/* =========================================
   SP
========================================= */

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

  .case_archive {
    padding: 3rem 0 4rem;
  }

  .case_archive_container {
    width: calc(100% - 32px);
  }

  .case_archive_intro {
    margin-bottom: 2.25rem;
  }

  .case_archive_intro h2 {
    font-size: 1.4rem;
  }

  .case_archive_intro p {
    font-size: 0.875rem;
    text-align: left;
  }

  .case_list {
    grid-template-columns: 1fr;
    gap: 2.75rem;
  }

  .case_card_title {
    font-size: 1.05rem;
  }

  .case_pagination {
    margin-top: 3.5rem;
  }
}