@charset "UTF-8";
/*
	Theme Name: asiaworks
	Author: Quolia.inc
*/
/* --- 基本設定 --- */
*{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	letter-spacing:0.22em;
	font-family: "noto-sans-cjk-jp", sans-serif;
	font-weight: 500;
	font-style: normal;
	font-feature-settings: "palt";
}
/* フォントロード中はテキスト（またはページ全体）を非表示、あるいは透明にする */
.wf-loading body {
  opacity: 0;
}

/* フォントロード完了、またはエラー時にフェードインで表示 */
.wf-active body,
.wf-inactive body {
  opacity: 1;
  transition: opacity 0.3s ease; /* じわっと出すとより綺麗です */
}

[id] {
  scroll-margin-top: 150px;
}
body {
    margin: 0;
    padding: 0;
    color: #35393e;
    line-height: 1.6;
    background-color: #fff;
}

img{
	max-width:100%;
	height:auto;
}
a{
	transition: all 0.3s ease 0s;
	text-decoration:none;
}
a:hover{
	/*filter: alpha(opacity=60);*/
	/*-moz-opacity:0.6;*/
	/*opacity:0.6;*/
}
a.cover{
	position:absolute;
	display:block;
	height:100%;
	width:100%;
	top:0;
	left:0;
	z-index:2;
}
.bold{
	font-weight:bold;
}
a.cover:hover{
	background:rgba(256,256,256,0.4);
}
.inline-block{
	display:inline-block;
}
.mar_t_10{
	margin-top:10px;
}
.mar_t_20{
	margin-top:20px;
}
.mar_t_30{
	margin-top:30px;
}
.mar_t_40{
	margin-top:40px;
}
.mar_b_0{
	margin-bottom:0px;
}
.mar_b_5{
	margin-bottom:5px;
}
.mar_b_10{
	margin-bottom:10px;
}
.mar_b_15{
	margin-bottom:15px;
}
.mar_b_20{
	margin-bottom:20px;
}
.mar_b_30{
	margin-bottom:30px;
}
.mar_b_40{
	margin-bottom:40px;
}
.mar_b_50{
	margin-bottom:50px;
}
.mar_b_60{
	margin-bottom:60px;
}
.mar_b_70{
	margin-bottom:70px;
}
.mar_b_80{
	margin-bottom:80px;
}
.mar_b_90{
	margin-bottom:90px;
}
.mar_b_100{
	margin-bottom:100px;
}
.mar_b_110{
	margin-bottom:110px;
}
.mar_b_120{
	margin-bottom:120px;
}
.mar_b_130{
	margin-bottom:130px;
}
.mar_b_140{
	margin-bottom:140px;
}
.mar_b_150{
	margin-bottom:150px;
}
.mar_b_160{
	margin-bottom:160px;
}
.mar_b_170{
	margin-bottom:170px;
}
.mar_b_180{
	margin-bottom:180px;
}
.mar_b_200{
	margin-bottom:200px;
}
.f_l{
	float:left;
}
.f_r{
	float:right;
}
.basic_text{
	font-size:15px;
	letter-spacing:0.16em;
	line-height:1.9;
}
.text-center{
	text-align:center;
}
.text-right{
	text-align:right;
}
.text-left{
	text-align:left;
}
.pc_on{
	display:block;
}
img.pc_on{
	display:inline-block;
}
.sp_on{
	display:none;
}
img.sp_on{
	display:none;
}

.relative{
	position:relative;
}
table{
}
.center_center{
	position: absolute;
	top: 50%;
	left: 50%;
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
body{
	overflow-x:hidden;
	width:100%;
	position:relative;
}
.inner{
	max-width:100%;
	width:1040px;
	margin:auto;
}
h1{
	text-align:center;
}
h2{
	text-align:center;
}
h3{
	text-align:center;
}
.flex{
	display:flex;
}
/* --- ヘッダー (Header) --- */
header {
    background: #FFF;
    /*position:fixed;*/
    top:0;
    left:0;
    width:100%;
    z-index:10000;
	transition: all 0.3s ease 0s;
	/*height:200px;*/
	display:flex;
	align-items:center;
}
header.is-fixed {
  position: fixed;
  top: 0;
  left: 0;
}
header.is-fixed .wrap{
	width:100%;
	position:relative;
    padding: 20px 30px 20px;
}
header .wrap{
	width:100%;
	position:relative;
    padding: 35px 30px 40px;
}
.index header .wrap::after{
	display:none;
}
header .wrap::after{
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	height:6px;
	content:"";
	display:block;
	background: linear-gradient(to right, #2cdb42, #1697c4, #ee011b);
}
header .inner ul li{
	margin-right:35px;
}
header .inner ul li.sp{
	display:none;
}
header .inner ul li:last-child{
	margin-right:0px;
}
header .inner ul li a{
	font-size:16px;
	font-weight:normal;
	letter-spacing:0.16em;
	transition: all 0.3s ease 0s;
}
header.is-fixed .inner ul li a{
	font-size:14px;
}
/*header.scroll {
    padding: 20px 30px 22px;
}
header .description {
    text-align: left;
    font-size: 14px;
    color:#fff;
    margin-bottom: 20px;
	transition: all 0.3s ease 0s;
}
header.scroll .description {
	display:none;
}

/* --- メインコンテンツ (Wrapper) --- */
.wrapper{
	overflow:hidden;

}
.basic_text{
	font-size:14px;
	letter-spacing:0.22em;
	line-height:1.7;
}
.wrapper {
    width: 100%;
    padding-top:0px;
}
.inner{
	width:1420px;
	max-width:100%;
	margin:0 auto;
	padding:0 30px;
}
.main{
	height:calc(100vh - 150px);
/*	background:url(./images/top/main.jpg);*/
	background-size:cover;
	background-position:center center;
}
.concept .main{
	height:608px;
	background:url(./images/concept/head_img.jpg);
	background-size:cover;
	background-position:center center;
	display:flex;
	align-items:center;
	justify-content:center;
}
.concept .main p{
	mix-blend-mode:soft-light;
}
.news .main{
	height:608px;
	background:url(./images/news/head_img.jpg);
	background-size:cover;
	background-position:center center;
	display:flex;
	align-items:center;
	justify-content:center;
}
.news .main p{
	mix-blend-mode:soft-light;
}
.works .main{
	height:608px;
	background:url(./images/works/head_img.jpg);
	background-size:cover;
	background-position:center center;
	display:flex;
	align-items:center;
	justify-content:center;
}
.works .main p{
	mix-blend-mode:soft-light;
}
.service .main{
	height:608px;
	background:url(./images/service/head_img.jpg);
	background-size:cover;
	background-position:center center;
	display:flex;
	align-items:center;
	justify-content:center;
}
.service .main p{
	mix-blend-mode:soft-light;
}
.company .main{
	height:608px;
	background:url(./images/concept/head_img.jpg);
	background-size:cover;
	background-position:center center;
	display:flex;
	align-items:center;
	justify-content:center;
}
.company .main p{
	mix-blend-mode:soft-light;
}

header .inner{
	width:1720px;
	max-width:100%;
	display:flex;
	justify-content:space-between;
	align-items:center;
}
header .inner h1 img{
	height:75px;
	width:auto;
	transition: all 0.3s ease 0s;
}
header.is-fixed .inner h1 img{
	height:40px;
}
header .inner ul{
	display:flex;
}
header .inner ul li{
	padding-left:10px;
}
.area_1{
	background:#35393e;
}
.area_1 .inner{
	padding:120px 30px 130px;
}
.area_1 .inner p{
	color:#fff;
	text-align:center;
	font-size:14px;
	line-height:1.5;
}
.area_1 .inner .big{
	font-size:29px;
	letter-spacing:0.22em;
	line-height:1.5;
	font-weight:700;
	margin-bottom:25px;
}
.logo_title{
	background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22206.5%22%20height%3D%22180.2%22%20version%3D%221.1%22%20viewBox%3D%220%200%20206.5%20180.2%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.st0%20%7B%20fill%3A%20%2335393e%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cpolygon%20class%3D%22st0%22%20points%3D%22204.1%20177.5%20103.2%202.8%202.4%20177.5%2096%20132.2%2066.9%20132.2%20103.2%2069.3%20139.5%20132.2%20110.5%20132.2%20204.1%20177.5%22%2F%3E%3C%2Fsvg%3E');
	background-size:60px;
	background-position:left center;
	background-repeat:no-repeat;
	padding-left:80px;
	display:flex;
	height:70px;
	align-items:center;
}
.logo_title>div{
	transform: translate(0%, -5%);
	text-align:left;

}
.logo_title>div>div:first-child{
	font-size:29px;
	font-weight:bold;
	line-height:1.5;
	overflow:hidden;
}
.logo_title>div>div:first-child *{
	font-size:29px;
	font-weight:bold;
	line-height:1.5;
}
.logo_title>div>div:last-child{
	font-size:18px;
	font-weight:bold;
	line-height:1;
	letter-spacing:0.22em;
}
.area_2{
	padding-bottom:290px;
}
.area_2 .inner{
	padding:200px 30px 80px;
}
.area_2 .flex{
	display:flex;
	align-items:center;
}
.area_2 .flex figure{
	width:50%;
	height:560px;
	background:url(./images/top/top_concept.jpg);
	background-size:cover;
	background-position:center center;
}
.area_2 .flex .text{
	padding-left:80px;
}
.area_2 .flex .text .title{
	font-size:29px;
	letter-spacing:0.1em;
	line-height:1;
	margin-bottom:50px;
	font-weight:bold;
}
.area_2 .flex .text .basic_text{
	margin-bottom:70px;
}
.area_3{
	display:flex;
	justify-content:flex-end;
	position:relative;
	padding-bottom:260px;
}
.area_3 .area_3_in{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	z-index:1;
}
.area_3 .inner .text{
	width:100%;
}
.area_3 .logo_title{
	margin-bottom:55px;
}
.area_3 .links{
	z-index:2;
	position:relative;
	top:0;
	right:0;
	width:55%;
	background-position:center center;
	aspect-ratio:1193 / 1118;
}
.area_3 .links{
	background-image:url(./images/top/top_service_1.jpg);
	background-size:110%;
}
@keyframes zoomOut {
  0% {
    background-size: 110%; /* スタートは拡大した状態 */
    opacity: 0.8;          /* ほんのり透明から始めるとさらに綺麗です（任意） */
  }
  100% {
    background-size: 100%; /* 最終的に100%に落ち着く */
    opacity: 1;
  }
}
.area_3 .links.one{
	background-image:url(./images/top/top_service_1.jpg);
	animation: zoomOut 0.3s ease-out forwards;
    background-size: 110%; /* スタートは拡大した状態 */
}
.area_3 .links.two{
	background-image:url(./images/top/top_service_2.jpg);
	animation: zoomOut 0.3s ease-out forwards;
    background-size: 110%; /* スタートは拡大した状態 */
}
.area_3 .links.three{
	background-image:url(./images/top/top_service_3.jpg);
	animation: zoomOut 0.3s ease-out forwards;
    background-size: 110%; /* スタートは拡大した状態 */
}
.area_3 .links.four{
	background-image:url(./images/top/top_service_4.jpg);
	animation: zoomOut 0.3s ease-out forwards;
    background-size: 110%; /* スタートは拡大した状態 */
}
.area_3 .links.five{
	background-image:url(./images/top/top_service_5.jpg);
	animation: zoomOut 0.3s ease-out forwards;
    background-size: 110%; /* スタートは拡大した状態 */
}
.area_3 .links.six{
	background-image:url(./images/top/top_service_6.jpg);
	animation: zoomOut 0.3s ease-out forwards;
    background-size: 110%; /* スタートは拡大した状態 */
}
.area_3 .links.seven{
	background-image:url(./images/top/top_service_7.jpg);
	animation: zoomOut 0.3s ease-out forwards;
    background-size: 110%; /* スタートは拡大した状態 */
}
.area_3 .links .flex{
	width:100%;
	display:flex;
	height:33%;
}
.area_3 .links .flex .box{
	flex: 1;
	display:flex;
	align-items:center;
	justify-content:center;
	padding:50px;
	border-bottom:1px solid #fff;
	border-right:1px solid #fff;
	position:relative;
}
.area_3 .links .flex .box a{
	position:absolute;
	display:block;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:2;
}
/*
.area_3 .links .flex .box::before{
	position:absolute;
	background:rgba(256, 256, 256, 0.7);
	top:0;
	left:0;
	height:100%;
	width:0px;
	display:block;
	content:"";
	z-index:1;
	transition: all 0.3s ease 0s;
}
.area_3 .links .flex .box:hover::before{
	width:100%;
}*/
.area_3 .links .flex .box::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #fff;
	opacity:0.2;
	z-index: -1;
	transform: scaleX(0);
	transition: transform 0.4s ease;
	transform-origin: right;
}
.area_3 .links .flex .box:hover::before {
	transform: scaleX(1);
	transform-origin: left;
}
.area_3 .links .flex .box p{
	text-align:center;
	color:#fff;
}
.area_3 .links .flex .box:last-child{
	border-right:0px solid #fff;
}
.area_3 .links .flex:last-child{
	height:34%;
}
.area_3 .links .flex:last-child .box{
	border-bottom:0px solid #fff;
}
.area_4 {
	background:#f8f6f1;
}
.area_4 .inner{
	padding:170px 30px;
}
.area_4 .head_flex{
	display:flex;
	justify-content:space-between;
	align-items:center;
	margin-bottom:60px;
}
.area_4 .flex{
	display:flex;
	justify-content:space-between;
	align-items:center;
}
.area_4 .flex .box{
	width:calc(33% - 15px);
	max-width:390px;
}
.area_4 .flex .box figure{
	margin-bottom:25px;
}
.area_4 .flex .box .date{
	font-size:11px;
	margin-bottom:4px;
	letter-spacing:0.1em;
}
.area_4 .flex .box .title{
	font-size:18px;
	margin-bottom:20px;
}
.area_4 .flex .box .description{
	font-size:16px;
	color:#9d9d9b;
}
.area_5 .inner{
	padding:170px 30px;
}
.area_5 .head_flex{
	display:flex;
	justify-content:space-between;
	align-items:center;
	margin-bottom:80px;
}
.footer_top{
	background:url(./images/common/footer_top.jpg);
	background-size:cover;
	background-position:center center;
}
.footer_top .logo_title{
	background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22206.5%22%20height%3D%22180.2%22%20version%3D%221.1%22%20viewBox%3D%220%200%20206.5%20180.2%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.st0%20%7B%20fill%3A%20%23fff%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cpolygon%20class%3D%22st0%22%20points%3D%22204.1%20177.5%20103.2%202.8%202.4%20177.5%2096%20132.2%2066.9%20132.2%20103.2%2069.3%20139.5%20132.2%20110.5%20132.2%20204.1%20177.5%22%2F%3E%3C%2Fsvg%3E');
	background-size:60px;
	background-position:left center;
	background-repeat:no-repeat;
	padding-left:80px;
	display:flex;
	height:70px;
	align-items:center;
}

.footer_top .inner{
	padding:200px 30px 180px;
}
.footer_top .inner .flex{
	display:flex;
	justify-content:space-between;
	align-items:center;
}
.footer_top .inner .flex *{
	color:#fff;
}
.footer_top .inner .flex .tel{
	display:flex;
	justify-content:space-between;
	align-items:center;
}
.footer_top .inner .flex .tel .items {
	width:290px;
	margin-right:30px;
}
.footer_top .inner .flex .tel .items .title{
	font-size:20px;
	margin-bottom:5px;
	lette-spacing:0.32em;
}
.footer_top .inner .flex .tel .items .eigyo{
	font-size:14px;
	lette-spacing:0.18em;
}
.footer_top .inner .flex .tel a{
	width:calc(100% - 320px);
}
.footer_top .inner .flex .tel a.tel_num{
	font-size:60px;
	letter-spacing:0.07em;
	font-family: "coolvetica", sans-serif;
	font-weight: 200;
	font-style: normal;
	white-space:nowrap;
}
.footer_top .inner .flex .tel a.contact{
	font-size:14px;
	letter-spacing:0.15em;
	border:1px solid #fff;
	border-radius:30px;
	text-align:center;
	padding:15px;
}
.footer_top .inner .flex > div hr{
	width:100%;
	border:none;
	border-top:1px solid #fff;
	margin:40px 0;
}
.footer_top .footer_contact{
	width:715px;
}
.c_area_1 .inner{
	padding:110px 30px 260px;
	width:1040px;
}
.c_area_1 .logo_h3{
	margin-bottom:270px;
}
.c_area_1 .inner .flex{
	display:flex;
}
.c_area_1 .inner .flex .left{
	padding:0 50px 0 80px;
	width:50%;
	font-size:29px;
	font-weight:700;
	letter-spacing:0.12em;
	line-height:1.8;
}
.c_area_1 .inner .flex .right{
	padding:0 60px 0;
	width:50%;
	font-size:14px;
	letter-spacing:0.22em;
	line-height:1.8;
	text-align:left;
}
.c_area_2{
	background:url(./images/concept/c_img_bk_1.jpg);
	background-size:auto 610px;
	background-repeat:no-repeat;
	background-position:center top;
	position:relative;
	padding-top:730px;
}
.c_area_2 .inner{
	/*transform: translate(0%, -400px);*/
	margin-top:-400px;
}
.c_area_2 .head_text{
	padding:100px 117px 100px 14.5%;
	top:0;
	left:0;
	position:absolute;
	background:rgba(256,256,256,0.4);
}
.c_area_2 .head_text p{
	font-size:37px;
	letter-spacing:0.3em;
	line-height:1.2;
	font-family: "shippori-mincho", sans-serif;
	font-weight: 500;
	font-style: normal;
}

/* コンテナの幅設定 */

.c_area_2 .concept-container {
	max-width: 1000px;
	margin: 0 auto;
	padding: 60px 20px;
}

/* 各ブロック（行）の設定 */
.c_area_2 .concept-block {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 70px;
	margin-bottom: 100px;
}
.c_area_2 .concept-block.one{
	padding-right:20px;
}
.c_area_2 .concept-block.three{
	/*transform: translate(0%, -300px);*/
	margin-top:-300px;
}
/* 偶数番目のブロックは左右を反転 */
.c_area_2 .concept-block.reverse {
	align-items: flex-start;
	flex-direction: row-reverse;
}

/* テキストエリアの設定 */
.c_area_2 .concept-text {
	flex: 1;
	/* 画像との縦のズレを表現するための余白（お好みで調整してください） */
	padding-top: 20px; 
}

.c_area_2 .concept-text h2 {
	font-size: 29px;
	font-weight: bold;
	color: #444;
	margin-bottom: 40px;
	letter-spacing: 0.22em;
	text-align:left;
}

/* 数字画像と説明文を横並びに */
.c_area_2 .text-content {
	display: flex;
	align-items: flex-start;
	gap: 24px;
	align-items:center;
}

.c_area_2 .number-img {
	width: auto;
	height: 137px;
	object-fit: contain;
}

.c_area_2 .text-content p {
	font-size: 15px;
	letter-spacing: 0.22em;
	line-height: 1.6;
}

/* 画像エリアの設定 */
.c_area_2 .concept-image {
	flex: 1;
}

.c_area_2 .concept-image img {
	width: 100%;
	height: auto;
	display: block;
	border:10px solid #fff;
}

.c_area_3{
	background:url(./images/concept/c_img_bk_2.jpg);
	background-size:auto 610px;
	background-repeat:no-repeat;
	background-position:center top;
	position:relative;

}
.c_area_3 .head_text{
	padding:80px;
	top:0;
	right:0;
	position:absolute;
	background:rgba(256,256,256,0.4);
}
.c_area_3 .head_text p{
	font-size:37px;
	color:#fff;
	letter-spacing:0.3em;
	line-height:1.2;
	font-family: "shippori-mincho", sans-serif;
	font-weight: 500;
	font-style: normal;
}
.c_area_3 .inner.one{
	height:610px;
	padding:80px;
	width:1040px;
	display:flex;
	align-items:center;
}
.c_area_3 .inner.one .basic_text{
	color:#fff;
}
.c_area_3 .inner.two{
	padding:220px 30px;
	text-align:center;
}
.c_area_3 .inner.two p{
	font-size:29px;
	font-weight:bold;
	letter-spacing:0.22em;
	line-height:1;
}
/* セクションの背景色設定 */
.s_area_1 .border_area{
	border-bottom:6px solid #f8f6f1;
}
.s_area_1 .inner{
	padding:110px 30px 110px;
	width:1420px;
}
.s_area_1 .logo_h3{
	margin-bottom:170px;
}
.s_area_1 .section-white {
	background-color: #ffffff;
	padding: 150px 0;
}
.s_area_1 .section-gray {
	background-color: #f7f6f2; /* 薄いベージュ系のグレー */
	padding: 150px 0;
}

/* コンテナの幅設定（ガイドラインに合わせて中央寄せ） */
.s_area_1 .container {
	max-width: 1720px;
	margin: 0 auto;
	padding: 0 20px;
}

/* 2カラムレイアウトの設定 */
.s_area_1 .row {
	display: flex;
	align-items: center; /* 縦の中央揃え */
	justify-content: space-between;
	gap: 70px;
}

/* 偶数番目のセクションは左右を反転させる */
.s_area_1 .row.reverse {
	flex-direction: row-reverse;
}

/* 画像エリアの設定 */
.s_area_1 .col-image {

	width: 52%;
	max-width:812px;
}
.s_area_1 .col-image img {
	width: 100%;
	height: auto;
	display: block;
}

/* テキストエリアの設定 */
.s_area_1 .col-text {

	width: 48%;
	padding: 20px;
}
.s_area_1 .reverse .col-text {
	padding: 20px 20px 20px 7.8vw;
}
/* 見出しの設定 */
.company_area_ayumi h2 ,
.company_area_2 h2 ,
.company_area_3 h2 ,
.s_area_1 .col-text h2 {
	font-size: 29px;
	font-weight: bold;
	margin-bottom: 40px;
	letter-spacing: 0.1em;
	line-height: 1.4;
	text-align:left;
}
.company_area_ayumi h2 span ,
.company_area_2 h2 span ,
.company_area_3 h2 span ,
.col-text h2 span {
	display: block;
	font-size: 14px;
	margin-top: 5px;
	font-family: "coolvetica", sans-serif;
	font-weight: 500;
}

/* 本文の設定 */
.s_area_1 .col-text p {
	font-size: 14px;
	letter-spacing: 0.22em;
	line-height: 1.5;
	margin-bottom: 90px;
}

/* ボタンの設定 */
.color_btn {
  display: inline-block;
  padding: 15px 50px;
  font-size: 13px;
  color: #333;
  text-decoration: none;
  letter-spacing: 0.16em;
  transition: all 0.3s ease;
  min-width:260px;
  text-align:center;
  font-weight:bold;
  
  /* --- 枠線グラデーションの調整 --- */
  border: 3px solid transparent; /* 3pxの透明な枠線を作る */
  border-radius: 30px;
  
  /* 内側の背景（白など）と、外側のグラデーション枠線を重ねる */
  background-image: linear-gradient(#fff, #fff), linear-gradient(to right, #2cdb42, #1697c4, #ee011b);
  background-origin: border-box;
  background-clip: padding-box, border-box;
}
.color_btn:hover {
	background-color: #333;
	border-color: #333;
}
.logo_h3{
	text-align:center;
}
.logo_h3 .big{
	letter-spacing:0.22em;
	line-height:1;
	margin-bottom:20px;
	font-weight:bold;
	font-size:29px;
	display:inline-block;
	overflow:hidden;
}
.logo_h3 .big *{
	font-size:29px;
	font-weight:bold;
}
.logo_h3 img{
	margin-bottom:16px;
	height:35px;
	width:auto;
	display:inline-block;
}
.logo_h3 .small{
	font-family: "coolvetica", sans-serif;
	letter-spacing:0.15em;
	line-height:1;
	font-weight:bold;
	font-size:18px;
	display:inline-block;
}

/* コンテナの設定 */
.n_area_1 {
	width: 1420px;
	max-width: 100%;
	margin: 0 auto;
	padding: 100px 20px 100px;
}
.n_area_1 .logo_h3{
	margin-bottom:90px;
}

/* ヘッダー部分（タイトルとロゴ） */
.news-header {
	text-align: center;
	margin-bottom: 60px;
}
.news-header h1 {
	font-size: 20px;
	font-weight: bold;
	letter-spacing: 0.1em;
	margin-bottom: 10px;
}
.news-header-logo {
	display: flex;
	justify-content: center;
	align-items: center;
}
.news-header-logo img {
	height: 40px; /* NEWSロゴの高さに合わせて調整してください */
	width: auto;
}

/* 2カラムグリッドの設定 */
.news-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	column-gap: 60px;
}

/* 個別のお知らせリストアイテム */
.news-item {
	display: flex;
	align-items: center;
	gap: 30px;
	padding: 50px 0;
	border-bottom: 1px solid #eee;
	transition: background-color 0.3s;
}
.news-item:first-child,
.news-item:nth-child(2) {
	border-top: 1px solid #eee;
}
/* ホバー時の背景色をわずかに変化 */
.news-item:hover {
	background-color: #fafafa;
}

/* サムネイル画像 */
.news-thumb {
	width: 211px;
	flex-shrink: 0;
}
.news-thumb img {
	aspect-ratio: 4 / 3;
	object-fit: cover;
	width: 211px;
}

/* テキスト部分（日付とタイトル） */
.news-content {
	flex-grow: 1;
}
.news-date {
	display: block;
	font-size: 14px;
	color: #999;
	margin-bottom: 8px;
	letter-spacing: 0.1em;
}
.news-title {
	font-size: 18px;
	line-height: 1.5;
	letter-spacing:0.1em;
}

/* ページネーションの設定 */
/* ページネーション全体のラッパー */
.wp-pagenavi {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 20px;
	margin-top: 60px;
}

/* リンクと現在のページ（ベースのスタイル） */
.wp-pagenavi a,
.wp-pagenavi span.current {
	font-size: 15px;
	color: #999;
	transition: color 0.3s;
	text-decoration: none; /* ※テーマによる下線を防ぐための記述（不要なら削除） */
}

/* ホバー時のスタイル */
.wp-pagenavi a:hover {
	color: #333;
}

/* 現在のページ（アクティブ）のスタイル */
.wp-pagenavi span.current {
	font-weight: bold;
	color: #333;
}
/* フィルター（カテゴリ）セクション */
/* 全体のベース背景（画像に合わせた薄いベージュ） */
.filter-section {
  background-color: #f2ede4;
  padding: 20px;
}

/* グリッドレイアウトの設定 */
.filter-list {
  display: grid;
  /* 左から：1.5倍の幅、1.5倍の幅、1倍、1倍、1倍 の5列。
    画像の比率（ALLと住宅建築が少し横に広い）に合わせて調整しています。
  */
  grid-template-columns: 1.5fr 1.5fr 1fr 1fr 1fr;
  /* 縦2行、それぞれの高さ（各45px、全体で約100px弱） */
  grid-template-rows: 45px 45px;
  /* ボタン同士の隙間 */
  gap: 10px;
  list-style: none;
  margin: 0 auto;
  width:980px;
  padding:20px;
  max-width:100%;
}

/* ボタン（li要素）の共通スタイル */
.filter-list li a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  background-color: #ffffff;
  color: #1a1a1a;
  text-decoration: none;
  border-radius: 6px;
  font-size: 16px;
  font-weight: 500;
  text-align: center;
  box-sizing: border-box;
  letter-spacing: 0.08em;
  transition: background-color 0.2s ease;
}

/* 左側の大きなボタン（2行分の高さをぶち抜く指定） */
.filter-list li {
  width:178px;
}
.filter-list li.large-btn {
  grid-row: span 2;
}

/* アクティブ状態（選択中）のスタイル */
.filter-list li a.active {
  background-color: #383d41; /* 濃いチャコールグレー */
  color: #ffffff;
}

/* ホバー時の簡易エフェクト（お好みで） */
.filter-list li a:hover {
  opacity: 0.85;
}
.w_area_1 .inner{
	padding:110px 30px 90px;
}
.gallery-top{
	margin-bottom:20px;
}
/* サムネイルの各スライドの基本設定 */
.gallery-thumbs .swiper-slide {
    width: 20%;
    height: 100%;
    background-size: cover;
    background-position: center;
    cursor: pointer;
    opacity: 0.7;
    transition: opacity 0.3s;
    
    /* 【追加】枠線をつけても画像のサイズがズレないようにする */
    box-sizing: border-box; 
    /* 初期状態は透明な枠線にしておき、ホバーや選択時のガタつきを防ぐ手法も有効です */
    border: 5px solid transparent; 
}

/* 選択中（アクティブ）のサムネイル */
.gallery-thumbs .swiper-slide-active {
    opacity: 1;
    /* 【追加】黒枠をつける（太さや色はピクセル数とカラーコードで調整してください） */
    border: 5px solid #888; 
}
/* ギャラリー（グリッド）コンテナ */
.w_area_2 .inner {
	width: 1420px;
	margin: 0 auto;
	padding: 80px 30px 280px;
}

/* 3カラムグリッドの設定 */
.area_4 .inner .gallery-grid ,
.w_area_2 .inner .gallery-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: 100px;
	row-gap: 80px;
}
.w_area_2 .inner .gallery-grid {
	margin-bottom:120px;
}
/* カード（各アイテム）の設定 */
.area_4 .inner .card-img ,
.w_area_2 .inner .card-img {
	margin-bottom: 12px;
	overflow: hidden;
}
.area_4 .inner .card-img img ,
.w_area_2 .inner .card-img img {
	aspect-ratio: 4 / 3; /* 画像の縦横比を固定 */
	object-fit: cover;
	width: 100%;
	transition: transform 0.3s;
}
.area_4 .inner .card:hover .card-img img ,
.w_area_2 .inner .card:hover .card-img img {
	transform: scale(1.05); /* ホバー時に少しズーム */
}

.area_4 .inner .card-content .date,
.w_area_2 .inner .card-content .date {
	font-size: 11px;
	color: #35393e;
	margin-bottom: 4px;
	letter-spacing:0.1em;
}
.area_4 .inner .card-content .title,
.w_area_2 .inner .card-content .title {
	font-size: 18px;
	font-weight: normal;
	letter-spacing:0.1em;
	margin-bottom: 20px;
	line-height: 1.4;
}
.area_4 .inner .card .tags ,
.w_area_2 .inner .card .tags {
	font-size: 16px;
	letter-spacing:0.22em;
	color: #888;
}
.area_4 .inner .card .tags a,
.w_area_2 .inner .card .tags a{
	font-size: 16px;
	letter-spacing:0.22em;
	color: #888;
	text-decoration:underline;
}
.news_detail .inner{
	padding:90px 30px 270px;
	width:1040px;
}
.news_detail .inner .slider{
	margin-bottom:100px;
}
.news_detail .inner .date{
	font-size:11px;
	letter-spacing:0.1em;
	margin-bottom:10px;
	text-align:center;
}
.news_detail .inner .title{
	font-size:29px;
	letter-spacing:0.22em;
	margin-bottom:90px;
	text-align:center;
	font-weight:bold;
}
.news_detail .inner p{
	line-height:2.2;
	font-size:16px;
	letter-spacing:0.22em;
}
.blog_text{
	margin-bottom:150px;
}
.news_detail .inner .btn_area{
	text-align:center;
}
.spacer{
	margin-bottom:60px;
}
.news_detail .inner .btn_area a{
	display:inline-block;
	padding:20px 30px;
	text-align:center;
	width:255px;
	border-radius:40px;
	font-size:14px;
	letter-spacing:0.16em;
	background:#f1ede4;
}
/* フッター全体の共通スタイル */
.footer-sitemap {
  background-color: #2d3136; /* 画像のダークグレー背景 */
  color: #ffffff;
  font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  padding: 60px 40px; /* 上下左右の余白（サイトに合わせて調整してください） */
  display:flex;
  justify-content:space-between;
}
.footer-sitemap .logo h2 img{
	width:170px;
	margin-bottom:20px;
}
.footer-sitemap .logo p{
	font-size:12px;
	letter-spacing:0.2em;
	line-height:1.8;
	color:#fff;
	text-align:center;
}
/* サイトマップのコンテナ（横並び） */
.sitemap-container {
  display: flex;
  justify-content: flex-start; /* 左詰めで配置 */
  align-items: flex-start;
  max-width: 1000px; /* コンテナの最大幅 */
}

/* 各カラムの基本設定 */
.sitemap-column,
.sitemap-column-right {
  flex: 1; /* 各カラムを均等な幅に（必要に応じてwidthで固定も可） */
  padding-left: 40px;
}

/* 右側カラム（縦線を含むエリア） */
.sitemap-column-right {
  position: relative;
  /* カラム自体の高さを出す（画像に合わせる場合は調整） */
  min-height: 240px; 
}

/* タイトル（事業内容） */
.sitemap-title {
  font-size: 14px;
  font-weight: normal;
  letter-spacing: 0.2em;
  margin-bottom: 15px;
  color:#fff;
  text-align:left;
}
.sitemap-title a{
  font-size: 14px;
  font-weight: normal;
  letter-spacing: 0.2em;
  color:#fff;
}
/* リストの初期化 */
.sitemap-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sitemap-list li {
  margin-bottom: 15px; /* 行間の調整 */
  line-height: 1;
}

/* リンクのスタイル */
.sitemap-list a {
  color: #ffffff;
  line-height:1;
  text-decoration: none;
  font-size: 14px;
  letter-spacing: 0.2em;
  transition: opacity 0.3s ease;
  white-space:nowrap;
}

/* ホバー時の演出（お好みで） */
.sitemap-list a:hover {
  opacity: 0.7;
}

/* --- 事業内容のダッシュ（——）の再現 --- */
.list-with-dash li {
  position: relative;
  padding-left: 28px; /* ダッシュの分だけ左に余白を作る */
  margin-bottom:10px;
}

.list-with-dash li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(100%);
  width: 20px; /* 線の長さ */
  height: 1px;  /* 線の太さ */
  background-color: #ffffff; /* 線の色 */
}
.list-with-dash li a{
  font-size: 12px;
  letter-spacing: 0.2em;
}
.sidebar{
	opacity:0;
	position:fixed;
	right:0;
	top:50%;
	width:75px;
	z-index:10;
	transform: translate(0%, -50%);
	transition: all 0.3s ease 0s;
}
.sidebar.scroll{
	opacity:1;
}
.sidebar .side_line_btn{
	background:#3cde51;
	margin-bottom:5px;
	width:75px;
	border-radius:13px 0 0 13px;
	padding:20px 13px 30px;
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
}
.sidebar .side_line_btn img{
	width:35px;
	margin-bottom:13px;
}
.sidebar .side_line_btn span{
	font-weight:bold;
	color:#fff;
	display:block;
	font-size:18px;
	width:100%;
	line-height:1.2;
	text-align:center;
	font-weight: bold;
	font-style: normal;
}
.sidebar .side_tel_btn{
	background:#35393e;
	margin-bottom:5px;
	width:75px;
	border-radius:13px 0 0 13px;
	padding:20px 13px 30px;
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
}
.sidebar .side_tel_btn img{
	width:30px;
	margin-bottom:13px;
}
.sidebar .side_tel_btn span{
	font-weight:bold;
	color:#fff;
	display:block;
	font-size:18px;
	width:100%;
	line-height:1.2;
	text-align:center;
	font-weight: bold;
	font-style: normal;
}
.company_area_1 .inner{
	padding:110px 30px 90px;
}
.company_area_2{
	background-color:#f8f6f1;
	position:relative;
}
.company_area_2 .img{
	width:34%;
	height:100%;
	background-image:url(./images/company/company_1.jpg);
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center;
	position:absolute;
	z-index:1;
	right:0;
}
.company_area_2 .inner{
	padding:90px 30px 120px;
	z-index:1;
	position:relative;
}
.company_area_2 .text_area{
	padding-right:125px;
	width:66%;
}
.company_area_3{
	padding-bottom:215px;
}
.company_area_3 .inner{
	padding:150px 30px 50px;
}
.company_area_3 .img{
	width:45%;
	background-image:url(./images/company/company_2.jpg);
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center;
}
.company_area_3 .text_area{
	width:55%;
	padding:60px 0 60px 125px;
}
.company_area_3 .text_area table{
	width:100%;
}
.company_area_3 .text_area table th{
	padding:15px 0;
	border-bottom:5px solid #f8f6f1;
}
.company_area_3 .text_area table th .title{
	display:flex;
	width:100%;
	justify-content:space-between;
	align-items:center;
}
.company_area_3 .text_area table th .title span{
	font-size:14px;
	font-weight:bold;
	letter-spacing:0.22em;
}
.company_area_3 .text_area table td{
	padding:15px 0 15px 50px;
	font-size:14px;
	letter-spacing:0.22em;
	border-bottom:5px solid #f8f6f1;
}
.company_area_3 .text_area table tr:last-child th,
.company_area_3 .text_area table tr:last-child td{
	border-bottom:0px solid #f8f6f1;
}
.company_area_ayumi{
	background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22745%22%20height%3D%22854.4%22%20version%3D%221.1%22%20viewBox%3D%220%200%20745%20854.4%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.st0%20%7B%20fill%3A%20%23fff%3B%20opacity%3A%200.1%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cpolygon%20class%3D%22st0%22%20points%3D%224.3%20849.6%20735.3%20427.6%204.3%205.5%20193.7%20397.3%20193.7%20275.7%20456.8%20427.6%20193.7%20579.5%20193.7%20457.8%204.3%20849.6%22%2F%3E%3C%2Fsvg%3E');
	background-position:left 5% bottom -90px;
	background-size:auto 100%;
	background-repeat:no-repeat;
	background-color:#35393e;
}
.company_area_ayumi .inner{
	padding:70px 30px 0px;
	width:1420px;
}
.company_area_ayumi .inner h2,
.company_area_ayumi .inner h2 *{
	color:#fff !important;
}
.company_area_ayumi .inner .flex{
	justify-content:flex-end;
}
.company_area_ayumi .inner .right{
	width:50%;
}
.company_area_ayumi .inner .ayumi{
	padding-bottom:130px;
	position:relative;
	overflow:hidden;
}
.company_area_ayumi .inner .ayumi::before{
	content:'';
	height:100%;
	width:1px;
	border-left:2px solid #fff;
	position:absolute;
	left:25px;
	top:30px;
	z-index:1;
}
.company_area_ayumi .inner .ayumi_box{
	display:flex;
	margin-bottom:80px;
	z-index:2;
	position:relative;
}
.company_area_ayumi .inner .ayumi_box:last-child{
	margin-bottom:0px;
}
.company_area_ayumi .inner .ayumi .circle{
	padding-top:10px;
	padding-right:24px;
	padding-left:10px;
	width:65px;
}
.company_area_ayumi .inner .ayumi .year{
	padding-right:30px;
	width:185px;
}
.company_area_ayumi .inner .ayumi .basic_text{
	color:#fff;
	width:calc(100% - 250px);
}
.privacy_text dt{
	margin-bottom:20px;
	font-size:18px;
	font-weight:bold;
}
.privacy_text dd{
	margin-bottom:40px;
	font-size:14px;
	line-height:1.5;
}
.contact_area .inner{
	width:1320px;
	padding:120px 30px 200px;
}
.contact_area .inner .item_title{
	display:flex;
	position:relative;
}
.contact_area .inner .item_title span{
	font-size:16px;
	font-weight:bold;
	letter-spacing:0.2em;
	color:#58c3e0;
	background-color:#fff;
	display:inline-block;
	padding:5px 5px 3px 0;
	position:relative;
	z-index:2;
}
.contact_area .inner .item_title::before{
	content:"";
	z-index:1;
	width:100%;
	height:1px;
	border-bottom:2px solid #58c3e0;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translate(0, -100%);
}
.contact_area .inner th{
	padding:30px 30px 30px 0;
	border-bottom:1px solid #eee;
	width:300px;
	text-align:justify;
	vertical-align:middle;
}
.contact_area .inner th .flex{
	display:flex;
	align-items:center;
}
.contact_area .inner th .flex .item{
	font-size:15px;
	margin-right:10px;
	letter-spacing:0.06em;
	line-height:1.5;
	width:150px;
	text-align:left;
	font-feature-settings: "palt";
}
.contact_area .inner th .flex .hissu{
	font-size:12px;
	color:#fff;
	padding:6px 14px 7px;
	border-radius:10px;
	background:#e93e32;
	line-height:1;
	white-space:nowrap;
}
.contact_area .inner td{
	width:calc(100% - 300px);
	padding:30px 0;
	border-bottom:1px solid #eee;
	line-height:1.5;
	vertical-align:middle;
}
.contact_area .inner td label{
	display:inline-block;
	margin-bottom:5px;
}
.contact_area .inner td .kome{
	padding-top:10px;
	font-size:10px;
	line-height:1.5;
	display:block;
}
.contact_area .inner td .kome.red{
	color:red;
}
.contact_area .inner td .kome.red *{
	color:red;
}
.contact_area .inner td p.yubin{
	display:inline-block;
	margin-right:10px;
}
.contact_area .inner td p{
	display:inline-block;
}
.contact_area .inner td input[type="text"],
.contact_area .inner td input[type="num"],
.contact_area .inner td input[type="number"],
.contact_area .inner td input[type="tel"],
.contact_area .inner td input[type="email"]{
	height:46px;
	font-size:13px;
	padding:10px;
}
.contact_area .inner td .flex{
	align-items:center;
}
.contact_area .inner td .flex .year_month{
	padding:0 10px;
}
.contact_area .inner td .age_class{
	text-align:right;
}
.contact_area .inner td select{
	padding:10px;
	height:46px;
	margin-right:0px;
}
.contact_area .mw_wp_form .horizontal-item + .horizontal-item{
	margin-left:0;
}
.contact_area .mw_wp_form .horizontal-item{
	margin-right:10px;
}
.contact_area .inner td .long{
	width:100%;
}
.contact_area .inner td .short{
	width:300px;
	max-width:100%;
}

.contact_area .inner td .long.mar{
	margin-bottom:10px;
}
.contact_area .inner td .zip_short{
	width:240px;
}
.contact_area .inner td .tel_short{
	width:400px;
}
.contact_area .inner td .zip_area{
	display:flex;
	align-items:center;
	margin-bottom:40px;
}
.contact_area .inner td .zip_area p{
	padding:0 15px;
}
.contact_area .inner td .zip_text input{
	margin-bottom:40px;
}
.contact_area .inner td .zip_text input:last-child{
	margin-bottom:0px;
}
.contact_area .inner a{
	text-decoration:underline;
}
.contact_area .inner tr.v-top th,
.contact_area .inner tr.v-top td{
	vertical-align:top;
}
.contact_area .inner tr.v-top td textarea{
	width:100%;
	height:300px;
	resize: none;
	padding:10px;
	font-size:13px;
	line-height:1.5;
}
.contact_area .inner tr.v-top td textarea.final_education{
	height:100px;
}
.contact_area .inner td p.text-right{
	display:block;
	font-size:12px;
}
.contact_area .inner td p.text-right *{
	font-size:12px;
}
.contact_area .inner td p.text-right .show-count.red{
	color:red;
}
.contact_area .inner table{
	width:100%;
	margin-bottom:50px;
}
.contact_area .inner .agree{
	padding-top:80px;
	text-align:center;
	margin-bottom:50px;
	border-top:2px solid #dcc3c3;
}
.contact_area .inner .agree .basic_text{
	font-size:16px;
	margin-bottom:50px;
}
.contact_area .red_under{
	font-size:16px;
	letter-spacing:0.2em;
	color:#e93e32;
	text-align:center;
	display:inline-block;
	text-decoration:underline;
}

.contact_area.entry_form .inner table,
.contact_area.mid_entry_form .inner table{
	width:100%;
	margin-bottom:75px;
}
.contact_area.entry_form .inner table.first_table{
	width:100%;
	margin-bottom:75px;
	transition: all 0.3s ease 0s;
}
.contact_area.entry_form .inner table.first_table.img_show{
	margin-bottom:50px;
	transition: all 0.3s ease 0s;
}
.contact_area.entry_form .inner figure.first_img{
	display:none;
	margin-bottom:115px;
}

.contact_area.mid_entry_form .inner .mw_wp_form_confirm figure.first_img{
	display:none;
}
.contact_area.mid_entry_form .inner .mw_wp_form_confirm  td .flex.age_box{
	margin-top:0;
}
.contact_area.mid_entry_form .inner figure.first_img{
	display:block;
	margin-bottom:115px;
}
.contact_area.entry_form .inner table.first_table th,
.contact_area.entry_form .inner table.first_table td{
	border-top:1px solid #eee;
}
.contact_area .inner input[type="submit"],
.contact_area .inner input[type="button"],
.contact_area .inner .send_btn{
	-webkit-appearance: none;
	display:inline-block;
	padding:20px 30px;
	text-align:center;
	width:255px;
	border-radius:40px;
	font-size:14px;
	letter-spacing:0.16em;
	background:#f1ede4;
}

.contact_area .inner .mw_wp_form .error{
	padding-top:10px;
	font-size:12px;
}
.contact_area .inner .tel_flex{
	display:flex;
	padding-bottom:60px;
	margin-bottom:60px;
	border-bottom:1px solid #e2e2e2;
}
.contact_area .inner .tel_flex .tel_contact_title{
	font-size:33px;
	letter-spacing:0.18em;
	font-weight:500;
	margin-right:70px;
	white-space:nowrap;
	padding-top:13px;
}
.contact_area .inner .tel_flex .tel_num_area{
	display:flex;
	align-items:center;
	flex-wrap:wrap;
}
.contact_area .inner .tel_flex .tel_num_area .border{
	padding:8px 14px 6px;
	display:inline-block;
	font-size:20px;
	text-align:center;
	letter-spacing:0.32em;
	border:1px solid #2e3f4a;
	margin-right:16px;
}
.contact_area .inner .tel_flex .tel_num_area a{
	display:inline-block;
	font-size:62px;
	font-weight:bold;
	letter-spacing:0.06em;
	font-family: "mr-eaves-modern", sans-serif;
	font-style: normal;
}
.contact_area .inner .tel_flex .tel_num_area .kome{
	font-size:15px;
	letter-spacing:0.16em;
	line-height:1.9;
	display:block;
	width:100%;
	padding-top:5px;
}
.contact_area .inner .basic_text{
	margin-bottom:30px;
}
.contact_area .intern{
	display:none;
}
.contact_area .logo_h3{
	margin-bottom:100px;
}


/*-----------------------------------------------アニメーション---------------------------------------------------*/
.effect-fade {
	opacity : 0;
	transform : translate(0, 25px);
	transition : all 1000ms;
}
.effect-fade.e_l {
	opacity : 0;
	transform : translate(-50px, 0);
	transition : all 1000ms;
}
.effect-fade.e_r {
	opacity : 0;
	transform : translate(50px, 0);
	transition : all 1000ms;
}
.effect-fade.e_r.center_center {
	opacity : 0;
	transform : translate(-260px, -50%);
	transition : all 1000ms;
}
.effect-fade.e_l.center_center {
	opacity : 0;
	transform : translate(-50px, -50%);
	transition : all 1000ms;
}
.effect-fade.effect-scroll {
	opacity : 1;
	transform : translate(0, 0);
}
.effect-scroll.delay025{
	transition-delay: 250ms;
}
.effect-scroll.delay050{
	transition-delay: 500ms;
}
.effect-fade.effect-scroll.center_center.e_r,
.effect-fade.effect-scroll.center_center.e_l{
	opacity : 1;
	transform: translate(-50%, -50%);
}
.delay span {
	display:inline-block;
	transition : all 500ms ease-out;
	transform : translate(0, 50px);
}
.delay.effect-scroll span:nth-child(1) {
	opacity : 1;
	transform : translate(0, 0);
	transition-delay: 0ms;
}
.delay.effect-scroll span:nth-child(2) {
	opacity : 1;
	transform : translate(0, 0);
	transition-delay: 100ms;
}
.delay.effect-scroll span:nth-child(3) {
	opacity : 1;
	transform : translate(0, 0);
	transition-delay: 200ms;
}
.delay.effect-scroll span:nth-child(4) {
	opacity : 1;
	transform : translate(0, 0);
	transition-delay: 300ms;
}
.delay.effect-scroll span:nth-child(5) {
	opacity : 1;
	transform : translate(0, 0);
	transition-delay: 400ms;
}
.delay.effect-scroll span:nth-child(6) {
	opacity : 1;
	transform : translate(0, 0);
	transition-delay: 500ms;
}
.delay.effect-scroll span:nth-child(7) {
	opacity : 1;
	transform : translate(0, 0);
	transition-delay: 600ms;
}
.delay.effect-scroll span:nth-child(8) {
	opacity : 1;
	transform : translate(0, 0);
	transition-delay: 700ms;
}
.delay.effect-scroll span:nth-child(9) {
	opacity : 1;
	transform : translate(0, 0);
	transition-delay: 800ms;
}
.delay.effect-scroll span:nth-child(10) {
	opacity : 1;
	transform : translate(0, 0);
	transition-delay: 900ms;
}
.delay.effect-scroll span:nth-child(11) {
	opacity : 1;
	transform : translate(0, 0);
	transition-delay: 1000ms;
}
.delay.effect-scroll span:nth-child(12) {
	opacity : 1;
	transform : translate(0, 0);
	transition-delay: 1100ms;
}
.effect-bg{
	position:relative;
}
.effect-bg::before{
	content:"";
	background:#FFF;
	height:100%;
	width:100%;
	position:absolute;
	top:0;
	left:0;
	display:block;
}
.effect-bg.effect-scroll::before {
	animation-name: top_4_a;
	animation-delay: 0ms;
	animation-duration: 1500ms;
	animation-timing-function: linear;
	animation-fill-mode: both;
}


.fade_anime{
	opacity:0;
	filter: blur(20px);
	scale: 1.2;
}
.fade_anime_2{/*スクロールアニメーション用*/
	opacity:0;
	filter: blur(20px);
	scale: 1.2;
}
.fade_anime_2.effect-scroll{
	animation: hitoyado_anime 1s ease forwards 0s;
}
@keyframes hitoyado_anime {
    40% {
        opacity: 1
    }

    to {
        opacity: 1;
        filter: blur(0);
        scale: 1
    }
}

/* =========================================
   1250px以上（PC版）のスタイル
========================================= */
@media screen and (min-width: 1250px) {
    /* ハンバーガーメニューはPCでは非表示 */
    .hamburger {
        display: none;
    }
    
    /* inner内を横並びにして両端揃えにする（既存のスタイルになければ追加） */
    header .inner {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    
    header .inner ul {
        display: flex;
        margin: 0;
        padding: 0;
        list-style: none;
    }
}

/* =========================================
   1249px以下（タブレット・スマホ版）のスタイル
========================================= */
@media screen and (max-width: 1249px) {
    /* ① 既存のナビゲーション（ul）を非表示にする */
    header .inner .glonavi{
        display: none;
        position:fixed;
        height:100%;
        width:100%;
        z-index:1000;
        background:rgba(256,256,256,0.3);
        align-items:center;
        justify-content:center;
        top:0;
        left:0;
    }
    header .inner .glonavi.active{
    	display:flex;
    }
    header .inner .glonavi ul{
    	display:block;
    	width:300px;
    	background:white;
    	padding:18px;
    	box-shadow:0 0 10px #888;
    }
    header .inner .glonavi ul li{
    	display:block;
    	padding:14px;
    	margin:0;
    	text-align:center;
    	border-bottom:1px solid #888;
    }
    header .inner .glonavi ul li:last-child{
    	border-bottom:0px solid #888;
    }
    /* inner内を横並びにして両端揃えにする */
    header .inner {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
header .inner ul li.sp{
	display:block;
}

    /* ② ハンバーガーメニューのボタンを表示・デザインする */
    .hamburger {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        width: 30px;
        height: 20px;
        cursor: pointer;
        z-index: 10001;
    }

    /* ハンバーガーメニューの3本線 */
    .hamburger span {
        display: block;
        height: 2px;
        width: 100%;
        background-color: #333; /* 線の色（サイトに合わせて変更してください） */
        border-radius: 2px;
        transition: all 0.3s ease;
    }
/* =========================================
       ハンバーガーメニュー「active」時の✕印アニメーション
    ========================================= */
    /* 1本目（一番上）の線を下に移動して45度回転 */
    .hamburger.active span:nth-child(1) {
        transform: translateY(9px) rotate(45deg);
    }

    /* 2本目（真ん中）の線を透明にして消す */
    .hamburger.active span:nth-child(2) {
        opacity: 0;
    }

    /* 3本目（一番下）の線を上に移動して逆方向に45度回転 */
    .hamburger.active span:nth-child(3) {
        transform: translateY(-9px) rotate(-45deg);
    }
    .area_3 .links .flex .box p{
		font-size:12px;
	}

}
