@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap');
:root {
  --fonts-color: #051332;
  --bg-color:#FBFDFB;
  --hover-color:#83776a;
  --bg-tya:#4f3d2b;
  --link-color:#888266;
  --link-hover:#5c5845;

}

html{
	scroll-behavior: smooth;

}
body {
	/*font-family: yu-mincho-36p-kana,yu-mincho-pr6n, sans-serif;*/
	font-family: 'Noto Sans JP', sans-serif;
	font-style: normal;
	font-weight: 400;
	line-height: 1.6;
	font-size: 15px;
	color:var(--fonts-color);
}
.max_w{
    max-width: 1400px;
}
#wrapper{
	overflow: hidden;
}

a {
  color: var(--fonts-color);
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
}
a:hover {
  text-decoration: none!important;
  color:var(--hover-color);
}
a:focus, a:active {
  outline: none;
}

::-webkit-selection {
  color: #777;
  background: #f4f5f7;
}

::-moz-selection {
  color: #777;
  background: #f4f5f7;
}

::selection {
  color: #777;
  background: #f4f5f7;
}
ul{
	margin:0;
	padding:0;
	list-style: none;
}
.min{
	font-family: yu-mincho-36p-kana,yu-mincho-pr6n, sans-serif;
	font-size: 2.3em;
}
.sub_h3{
	font-size: 1em;
}
/**header**/

.sdgs_logo{
	border-left: 1px solid #ccc;
}


/* 横並びレイアウト */
.header-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 10px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* ロゴ部分 */
.logo img {
  height: 60px;
  width: auto;
}

/* ナビ部分 */
.main-nav ul {
  display: flex;
  gap:40px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.main-nav a {
  text-decoration: none;
  color: #333;
  font-weight: 500;
  position: relative;
  padding: 5px 0;
}

.main-nav a:hover {
  color: #8D785A;
}

/* 下線アニメーション（参考サイト風） */
.main-nav a::after {
  content: "";
  position: absolute;
  bottom: -3px;
  left: 0;
  width: 0%;
  height: 1px;
  background: #8D785A; ;
  transition: width 0.3s ease;
}

.main-nav a:hover::after {
  width: 100%;
}

/* スマホ対応 */
@media (max-width: 768px) {
  .header-inner {
    align-items: flex-start;
  }

  .main-nav ul {
    flex-direction: column;
    gap: 15px;
    width: 100%;
  }

  .main-nav a {
    display: block;
    width: 100%;
  }
}

/***/

/**btn_arrow**/
.link2 p{
	display: block;
}
.btn_arrow{
    /*矢印と下線の基点とするためrelativeを指定*/
  position: relative;
    /*形状*/
    display: inline-block;
    color: #fff;
    text-decoration: none;
    outline: none;
}

/*矢印と下線の形状*/
.btn_arrow::before{
    content: '';
    /*絶対配置で下線の位置を決める*/
  position: absolute;
    top:50%;
    right:13%;
    /*下線の形状*/    
    width: 9%;
    height: 1px;
  background:#fff;
    /*アニメーションの指定*/
    transition: all .3s;
	z-index: 100;
}

.btn_arrow::after{
    content: '';
    /*絶対配置で矢印の位置を決める*/
  position: absolute;
    top:47%;
    right:13%;
    /*矢印の形状*/    
    width: 15px;
    height:1px;
  background:#fff;
    transform: rotate(20deg);
    /*アニメーションの指定*/
    transition: all .3s;
	z-index: 100;
}

/*hoverした際の移動*/
.btn_arrow:hover::before{
    right:12%;
	background-color:#62543E!important
}

.btn_arrow:hover::after{
    right:12%;
	background-color:#62543E!important
}



/************************/

header{
	background-color:#fff;
	height: 130px;
}
header h1{
	font-size: 2em;
	letter-spacing: 2px;
}
header h1 span{
	font-size: 23px;
	display: inline-block;
	margin-right: 10px;
}
header h2{
	font-size: .7em;
	letter-spacing: 2px;
}
header h3{
	margin-bottom: 0;
	font-size: 1.1em;
	text-align: center;
}

/**logo**/
header h1 img{
	max-height: 38px;
}
/**sub_nav**/
.sub_nav li a{
	display: block;
	color:#fff;
	font-size: .8em;
	padding: 5px 15px;
}


/*nav***/




.list-inline-item:not(:last-child) {
    margin-right: 0;
}
.article_nav .sub_nav li a{
	color:#171717!important;
}
#nav{

	padding-top: 5px;
	max-width: 600px;
}
#nav li a{
	font-size: 1em;
	display: block;
	position: relative;
	z-index: 2;
}
#nav li a span{
	display: block;
	font-size: 10px;
	margin:0;
	padding:0;
	letter-spacing: 1px;
	color:#62543E
}
.con_link a{
	display: block;
	background-color:#F8D100;
	padding: 13px 45px;
	border-radius:100vw;
}



/*slide**/

/* CSS部分 */
/* 画像コンテナ（必須） */
.swiper .swiper-img {
  overflow: hidden;
  display: block;
  width: 100%;
  height: 100%;
}

/* 画像そのものにtransformを適用する（img または背景要素） */
.swiper .swiper-img img {
  width: 100%;
  height: auto;
  display: block;
  transform: scale(1);
  transition: transform 6s ease-in-out; /* スライド表示中にゆっくり拡大 */
  will-change: transform, opacity;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transform-origin: center center;
  /* GPU合成強制（滑らかにするための小ワザ） */
  transform: translateZ(0) scale(1);
}

/* アクティブスライド時に拡大 */
.swiper-slide-active .swiper-img img {
  transform: translateZ(0) scale(1.03);
}

/* 次／前のスライドは縮めておく（不要な変化を抑える） */
.swiper-slide-next .swiper-img img,
.swiper-slide-prev .swiper-img img {
  transform: translateZ(0) scale(1);
}

/* フェードのときの重なり順を安定させる（必要なら） */
.swiper .swiper-slide {
  pointer-events: none; /* クリック干渉抑制（任意） */
}

/* ページネーションやナビは上に表示 */
.swiper-pagination,
.swiper-button-next,
.swiper-button-prev {
  z-index: 10;
}

/* スライダー全体 */
#slider_w {
  position: relative;
  width: 100%;
  height: 60vh; /* PC時の高さ */
  overflow: hidden; /* ← これが重要：余白カット */
}

/* Swiper本体 */
#slider_w .swiper {
  width: 100%;
  height: 100%; /* ← #slider_wの高さに合わせる */
}

/* スライドごと */
#slider_w .swiper-slide {
  width: 100%;
  height: 100%;
}

/* 画像調整 */
#slider_w .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* ← アスペクト比維持しつつフィット */
  display: block;
}

/* モバイル時に高さを調整 */
@media (max-width: 768px) {
  #slider_w {
    height: 40vh;
  }
}
@media (max-width: 1200px) {
	/*sdgsロゴ**/
	.header-inner {
	  justify-content:flex-start;
	  }
	.sdgs_logo{
		margin-left: 30px;
	}
}



/**slide_text*/

.text_slide{
	height: 100px;
	display: block;
	position: absolute;
	top: 40%;
	width: 100%;
}
.slide_text_w{
	position: absolute;
	width: 100%;
	display: block!important;
    z-index: 10;
}
.slide_text_w h2{
    margin-bottom: 0;
    font-style:italic;
    font-family:YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    letter-spacing: 2px;
	font-size: 2.5em;
	text-align: center;
	color:#fff;
	z-index: 2
}
.slide_text_w h3{
	font-size: 1.5em;
	letter-spacing: 3px;
	margin-top: 10px;
	color:#fff;
}

/***concept***/
.line_mark{
	background:linear-gradient(transparent 70%,rgba(175,144,100,.3) 70%);

	
}
#concept{
	background-image:url("../img/concept_bg.png");
	background-position: right top;
	background-repeat: no-repeat;
	background-size: cover;

}
#concept h3{
	font-size: 2.2em;
	color:#161310;
}
#concept h4{
	font-size: 1.7em;

}
.concept_box h5{
	font-size: 1.2em;
	text-align: center;
	line-height:1.4em;
	border-left:1px solid #8D785A;
	border-right:1px solid #8D785A;
	padding:0px 10px;
	font-weight: bold;
}


/**link***/
.link_btn a{
	display: block;
	background-color:#8D785A;
	color:#fff;
	padding:15px 0;
	text-align: center;
	cursor: pointer;
	position: relative;
	max-width: 350px;
	border-radius: 100vw;

}
.link_btn a:hover{
	background-color:#62543E;
}
.link_btn a:before{
	content: "";
    position: absolute;
    right: 25px;
    top: calc((100% - 7px)/2);
    width: 7px;
    height: 7px;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
    -webkit-transform: rotate(-35deg);
    transform: rotate(-45deg);
	transition: .3s linear;
}
.link_btn a:hover:before{
	right: 20px;
}



.link p{
	margin-bottom: 0;
}
.link2 a{
	display: block;
	background-color:#333;
	color:#fff;
	padding:25px 0;
	text-align: center;
	cursor: pointer;
}
.link2 a:hover{
	background-color:#62543E;
}

.link2 p{
	margin-bottom: 0;
}

.btn_link{
    /*アニメーションの起点とするためrelativeを指定*/
    position: relative;
  overflow: hidden;
    /*ボタンの形状*/
  text-decoration: none;
  display: inline-block;
    padding: 10px 30px;
    text-align: center;
    outline: none;
    /*アニメーションの指定*/   
    transition: ease .2s;
	color:#333;
	border:2px solid #333;
}
.btn_link:hover{
	border:2px solid rgba(98,84,62,1.00)
}

/*ボタン内spanの形状*/
.btn_link span {
  position: relative;
  z-index: 3;/*z-indexの数値をあげて文字を背景よりも手前に表示*/
}

.btn_link:hover span{
  color:#333!important;
}

/*== 背景が流れる（左から右） */
.bgleft:before {
  content: '';
    /*絶対配置で位置を指定*/
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
    /*色や形状*/
  background:#fff;/*背景色*/
  width: 100%;
  height: 100%;
    /*アニメーション*/
  transition: transform .6s cubic-bezier(0.8, 0, 0.2, 1) 0s;
  transform: scale(0, 1);
  transform-origin: right top;

}

/*hoverした際の形状*/
.bgleft:hover:before{
  transform-origin:left top;
  transform:scale(1, 1);
}
.link2.f_mail a.btn_link{
	background-color:#1d69cf;
	border:2px solid #fff;
}

.link2.f_mail a.btn_link:hover{
	background-color:#1d69cf;
	border:2px solid #1d69cf;

}
.link2.f_mail a.btn_link:hover span{
	color:#1d69cf!important;
}
/*hoverした際の移動*/
.link2.f_mail .btn_arrow:hover::before{
	background-color:#1d69cf!important
}

.link2.f_mail .btn_arrow:hover::after{
	background-color:#1d69cf!important
}

/*cl**/
.cl_w{
	color:#fff;
}
/*top_se**/
.title_h2{
	font-size: 3.2em;

  font-family: "Outfit", sans-serif;
  font-style: normal;

}

.top_se_box{
	background-color:#fff;
	overflow: hidden;

	border:1px solid #8D785A;
}



/*top_se**/
.top_se{background-color:#f4f5f7}
.carousel-item img{
	border-radius: 10px 0 0 10px;
}

.top_se_box span{
	color:#8D785A;
}
.top_se_box a{
	display: block;
	padding: 15px;
}
/*top_info***/
#top_info{
	background-color:#f4f5f7;
}
#top_info ul{
	padding:15px;
}
.info_w{
	background-color:#fff;
	padding:30px;
}
.info_w li a{
	border-bottom: 1px dashed #ddd;
	display: block;
	padding:15px 0;
	position: relative;
}
.info_w li a::after{
	content: "";
    position: absolute;
    right: 25px;
    top: calc((100% - 7px)/2);
    width: 7px;
    height: 7px;
    border-right: 1px solid #8D785A;
    border-bottom: 1px solid #8D785A;
    -webkit-transform: rotate(-35deg);
    transform: rotate(-45deg);
	transition: .3s linear;
}
.info_w li a:hover{
	background-color:#fafafa;
}
.top_cate{
	font-size: 11px;
	padding:0 7px;
	display: inline-block;
	border-radius: 2px;
	margin-right: 10px;
}
.top_cate.information{
	background-color:#E1DAD0;
}
.top_cate.events{
	background-color:#E1E1BE;
}
/**日付幅トップページとお知らせアーカイブページ*/
.top_date{
	width:80px;
	display: inline-block;
}

/**f_bottom**/
#f_bottom h1 {
	font-size: 2em;
	color:#fff;
}
#f_bottom h1 span{
	font-size: 21px;
	color:#ffff;
}
#f_bottom h2{
	font-size: 1.2em;
	color:#ffff;
}
#map iframe,.map_w iframe{
	vertical-align:bottom;
}






.f_toi_text{
	font-size: 1.3em;
}
span.tyuui{
	background-color:#E1DAD0;
	border-bottom: 1px dashed rgba(98,84,62,1.00);
	display: inline-block;
	padding: 0 5px;
}

/*footer**/
/**f_toi**/
footer{
	background-image: url("../img/f_bg.png");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: bottom;

}


.footer-contact {
  background: #f8f9fa;
  padding: 60px 0;
}

.f_box {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
  padding: 30px 20px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  height: 100%;
}
.f_box:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 18px rgba(0,0,0,0.15);
}

.f_box img {
  max-width: 70px;
}

.f_title {
  font-weight: 700;
  font-size: 1.2rem;
  color: #333;
}

.f_tel {
  font-size: 2.5rem;
  color: #333;
  margin-bottom: 0;
	 font-family: "Outfit", sans-serif;
}

.f_note {
  font-size: 0.9rem;
  color: #777;
  margin-top: 5px;
}

.link_mail {
  display: inline-block;
  background: #333;
  color: #fff;
  padding: 10px 25px;
  border-radius: 30px;
  font-weight: 600;
  margin-top: 10px;
  transition: background 0.3s ease;
}
.link_mail:hover {
  background: #62543E;
  color: #fff;
  text-decoration: none;
}
.f_list a{
	color:#fff;
}
p.copy{
	font-size: 12px;
	padding:15px;
	color:#fff;
	text-align: center;
}

/**title**/
.com_bg{
	background-image: url("../img/about_bg.jpg");
}
.se_bg{
	background-image: url("../img/se_bg.jpg");
}
.contact_bg{
	background-image: url("../img/contact_bg.jpg");
}
.csr_bg{
	background-image: url("../img/csr_bg.jpg");
}


.works_title{
	background-image: url("../img/work_bg.jpg");
}

.works_single{
	background-image: url("../img/works_single.jpg");
}
.works_single h2{
	color:#333!important;
}
p.single_cate{
	display: inline-block;
	background-color:#DDE9F1;
	padding: 5px 25px;
	border-radius: 50vw;
	color:#2F9ADE;
	
}
#single_works{
	background-color:#f4f5f7;
}
.single_w{
	background-color:#fff;
}
.single_w img{
	margin: 20px 0;
}
#title{
	padding:100px;
	background-size: cover;
	background-position: center center;
	width:100%;
	height: auto;
	text-align: center;
}
#title h2,#title h3{
	text-align: center;
	text-shadow: 0 0 1px #2E2617;
}
#title h2{
	font-size: 2em;
	font-weight: 300;
	color:#fff;
}
#title h3{
	font-size: 1em;
	margin-bottom: 0;
	letter-spacing: 2px;
	color:#E1DAD0;
	font-weight: 300;
}
.title_w{
	width:400px;
	margin:0 auto;
	padding:30px;
}
.contact_bg .title_w h3{
	color:#E1DAD0!important
}
/*article***/
/***btn_anime***/


/**article**/
.aka{
	color:#62543E;
	font-size: 1.1em;
}

/*company**/

table.com_tbl{width:100%;}

.com_tbl td{
	padding:20px;
	border-bottom: 1px solid #ddd;
}
.com_tbl td:nth-child(odd){
	color:#777;
	width: 30%
}
.office_w{
	border: 1px solid #ddd;
	padding: 30px;
	background-color:#FCFCFD;
}
.office_w > p{
	font-size: 1.2em;
}
.office_w td{
	padding: 5px;
}
.office_w td:nth-child(odd){
	width: 35%;
}
/**service**/
.se_page h3{
	font-size: 1.7em;
}

.se_list{
	position: relative;
}
.se_text{
	position: absolute;
	display:block;
	background-color:#fff;
	top: 10px;
	left: 10px;
	padding: 5px 15px;
}

.se_box_w h3{
	background-color:#f4f5f7;
	padding: 15px;
}
.se_box_w h4{
	border-bottom:1px dashed #ccc;
	padding-bottom: 10px;
	font-size: 1.3em;
		

}

.se_img_w figure{
	height: 280px;
	overflow: hidden;
}
.se_img_w img{
	object-fit: cover;
	height: 280px;
	width: 100%;
}

/**主な仕事*/
.st{
	margin-top: 30px;
	background-color:#F4F7F7;
	padding: 25px;

}
.st p{
	color:#02436C;
}
.st ul li{
	background-color:#fff;
	padding: 10px 20px;
	border-bottom: 1px dotted #ddd;
	font-size: .9em;
}

/*se**/
h3.sub{
	background-color:#F0EFE8;
	padding:10px 25px;
	display: inline-block;
	border-radius: 20px;
}
.line{
	background: -webkit-linear-gradient(transparent 70%, #fdf479 0%);
	background: -o-linear-gradient(transparent 70%, #fdf479 0%);
	background: linear-gradient(transparent 70%, #fdf479 0%);
}
	
	/****スマホ*****/


/* メインコンテンツ */
.contents {
    width: 100%;
    height: 100vh;
    padding: 0;
    margin: 0;
	box-shadow: 0 0 50px 0 rgba(0,0,0,.8);
	-webkit-transition-property: all;
	transition-property: all;
	-webkit-transition-delay: .3s;
	transition-delay: .3s;
	-webkit-transition-duration: .5s;
	transition-duration: .5s;
}
/* チェックボックスオンの時 */
.check:checked ~ .contents {
    -webkit-transform: translateX(-300px);
    -ms-transform: translateX(-300px);
    transform: translateX(-300px);
}

/* ドロワー */
.drawer-menu {
    position: fixed;
    top: 0px;
    right: 0;
    width: 100%;
    height: 100%;
	padding: 100px 0;
	background: #333;
	-webkit-transition-property: all;
	transition-property: all;
	-webkit-transition-duration: .5s;
	transition-duration: .5s;
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
	-webkit-transform-origin: right center;
	-ms-transform-origin: right center;
	transform-origin: right center;
	-webkit-transform: perspective(500px) rotateY(-90deg);
	transform: perspective(500px) rotateY(-90deg);
	opacity: 0;
	z-index: 1111111111;
	overflow: scroll;
}

.drawer-menu li {
	text-align: left;
}

.drawer-menu li a {
	display: block;
	font-size: 16px;
	color: #fff;
	-webkit-transition: all .8s;
	transition: all .8s;
	padding-left:20px;
	font-weight: bold;
	padding:15px 20px;
	border-bottom: 1px solid #eee;
}

.drawer-menu li a:hover {
	color: #5E4923;

}
/* ------------------------------------------------ checkbox */
.check {
	display: none;
}

/* ------------------------------------------------ menu button */
.menu-btn {
	position: fixed;
	display: block;
	top: 0px;
	right: 0px;
	display: block;
	width: 52px;
	height: 50px;
	font-size: 10px;
	text-align: center;
	cursor: pointer;
	z-index: 111114;
	background-color:#333;
    background-size: cover;
	background-position: right;
	padding:3px;
	
}

.bar {
	position: absolute;
	top: 7px;
	left: 11px;
	display: block;
	width: 33px;
	height: 1px;
	background: #fff;
	-webkit-transition: all .5s;
	transition: all .5s;
	-webkit-transform-origin: left top;
	-ms-transform-origin: left top;
	transform-origin: left top;
}

.bar.middle {
	top: 16px;
	opacity: 1;
}

.bar.bottom {
	top: 25px;
	-webkit-transform-origin: left bottom;
	-ms-transform-origin: left bottom;
	transform-origin: left bottom;
}

.menu-btn__text {
	position: absolute;
	bottom: 3px;
	left: 11px;
	margin: auto;
	color: #fff;
	-webkit-transition: all .5s;
	transition: all .5s;
	display: block;
	visibility: visible;
	opacity: 1;
	font-size: 10px!important;
  font-family: "Outfit", sans-serif;
  font-style: normal;

	letter-spacing: 1px
}

.menu-btn:hover .bar {
	background:  #fff;
}
.menu-btn:visit .bar {
	color: #fff;
}
.menu-btn:hover .menu-btn__text {

}

.close-menu {
	position: fixed;
	top: 0;
	right: 250px;
	width: 100%;
	height: 100vh;
	background: #1A3249;
	cursor: url(../images/cross.svg),auto;
	-webkit-transition-property: all;
	transition-property: all;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
	visibility: hidden;
	opacity: 0;
}

/* ------------------------------------------------ checked */
.check:checked ~ .drawer-menu {
	-webkit-transition-delay: .3s;
	transition-delay: .3s;
	-webkit-transform: none;
	-ms-transform: none;
	transform: none;
	opacity: 1;
	z-index:13;
}

.check:checked ~ .contents {
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
	-webkit-transform: translateX(-300px);
	-ms-transform: translateX(-300px);
	transform: translateX(-300px);
}

.check:checked ~ .menu-btn .menu-btn__text {
	visibility: hidden;
	opacity: 0;
}

.check:checked ~ .menu-btn .bar.top {
	width: 42px;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}

.check:checked ~ .menu-btn .bar.middle {
	opacity: 0;
}

.check:checked ~ .menu-btn .bar.bottom {
	width: 42px;
	top: 36px;
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.check:checked ~ .close-menu {
	-webkit-transition-duration: 1s;
	transition-duration: 1s;
	-webkit-transition-delay: .3s;
	transition-delay: .3s;
	background: rgba(0,0,0,.2);
	visibility: visible;
	opacity: 1;
	z-index: 3;
}

.sp_toi a{
  background-color: #856835;
  color:#fff;
  padding:17px 35px;
  text-align: center;
  display: block;
	font-size: 1.1em;
	border-radius: 50vw;
	margin-top: 20px;
}

/*photo_gallery**/
.photo_box img{
	width: 100%;
	height: 200px;
	object-fit: cover;
}
#photo{
	background-image: url("../img/photo_bg.jpg");
	background-size: cover;
	background-position: bottoms;
}
/*tuki**/
.table_fee th{
	text-align: center;
	padding:30px;
	background-color:#E5F1F2;
	border:1px solid #fafafa;
	color:#01A19C
}
.table_fee td{
	width:28%;
}
.text_left{
	font-size: 13px!important;
	color:#f00;
	padding:30px!important;
}
/*scr.sdgs**/
#sdgs h3{
	font-size: 4em;
}
.sdgs_text{
	font-size: 1.6em;
}
.sdgs_w h4{
	font-size: 2em;
	color:#0C8AD8;
}
.sdgs_w h4 span{

	margin-right:5px;
	display: inline-block;
}
.sdgs_w{
	background-color:#fff;
	padding: 30px;
	border-radius: 10px;
}
.sdgs-section{
	padding-bottom: 30px;
}
.sdgs-section p{
	font-size: 1.15em;
	letter-spacing: 1px
}
.sd_text_btm{
	font-size: 1.1em;
	margin-bottom: 30px;
}
/**sp***/
@media screen and (max-width: 552px) {
	header h1{
		font-size: 2em;
		letter-spacing: -1px;


	}
	header h2{
		font-size:0.74em;
		letter-spacing:-0.5px;
	}
}

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

	.carousel-item{
		height: 40vh;
	}
	.info_w{
		padding:15px;
	}
	.top_cate{
		padding:2px 5px!important;
	}
	#top_gallery figure img,#top_gallery figure{
		height: 120px
	}
	/**top_concept*/
	#concept{
		background-image: none;
	}
	#concept h3{
		font-size: 1.12em;
		text-align: center
	}
	#concept h4{
		font-size: 1.4em;
	}
	#title{
		padding:80px 0;
	}
	.title_w{
		width:100%;
	}
	.se_tbl td{
		display: block;
		widows: 100%;
	}
	table.se_tbl td.bg-white{
		border:1px solid #eee;
	}
	table.se_tbl td:nth-child(even){
		border:1px solid #eee;
	}
	.exe_roujin h2{
		font-size: 1.4em;
	}
	.exe_roujin h3 {
		margin-right: 0;
		font-size: 1.2em;
	}
	.exe_roujin table td{
		font-size: .8em;
	}
	.jikohutan_tbl td:nth-child(1){
		width:25%;
	}
	.se_list h4{
		font-size: 1.4em;
	}
    .js-scrollable {
        width: 100%;
        overflow-x: scroll;
	}
	.table_fee{
		width:600px;
  display: block;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
	}
	/*mail**/
	.wpcf7 .template02 p.form__body{
		padding:30px 0!important;
	}
	#wpcf7-f5-p109-o1{
		margin-bottom: 30px;
	}
	.table_fee th,.table_fee td{
		width: 250px!important;
		padding:15px;
	}
	/**info*/
	.information,.events{
		padding:3px 15px!important;
	}
}
@media (max-width: 768px) {
	header{
		height: 100px;
	}
	.slide_text_w{
		width: auto;
	}
	.slide_text_w h2{
		font-size: 1.4em;
	}
	.slide_text_w h3{
		font-size: .91em;
	}
	.logo img {

	}
	.link_btn a{
		margin:20px auto;
		max-width: 300px;
	}
	.f_box{
		padding: 15px;
		border: 1px solid #eee;
	}
	.link_mail{
		width: 300px;
		padding: 15px 0;
	}
	footer{

	background-size: contain;
	padding-bottom: 70px;
}
	/**article*/
	#article{
		padding: 0 15px;
	}
	/*about**/
	.com_tbl td:nth-child(odd){
		width: 35%;
	}
	/*service**/
	.catch_h2{font-size: 1.23em;}
	.se_text{
		font-size: .8em;
	}
	.se_list_img{
		margin-bottom: 25px;
	}
	.se_img_w {
		margin-bottom: 30px;
	}
	.se_img_w figure{
		height: 150px
	}
	.se_img_w img{
		height: 150px
	}
	.card-body{
		padding: 15px;
	}
	.card-title{
		font-size: 1em;
	}
	.catch_h2_csr{
		font-size: 1.5em;
	}
	/*csr*/
	.csr_w{
		padding: 0 15px;
	}
	.csr_w h3{
		font-size: 1.5em;
	}
	#csr_summary p{
		font-size: .9em;
	}
	#sdgs h3{
		font-size: 2.4em;
		padding-top: 40px;
	}
	.sdgs_text{
		font-size: 1.2em;
	}
	.sdgs_text br{
		display: none;
	}
	.sdgs-section img{
		max-width: 80px!important;

			
	}
	.sdgs-section p{
		font-size: 1em;
	}
	.sp_toi img{
		margin-right: 10px;
	}
	.sp_toi p,.sp_toi p a{
		color:#fff;
	}
	.sp_toi .f_tel{
		font-size: 2.2em;
		letter-spacing: 2px;
	}
	/*sdgs*/
	.sdgs_logo{
		margin-top: 40px;
		padding-right: 10px!important;
		padding-left: 15px!important;
		margin-left: 15px;
	}
	.sdgs_logo img{
		width: 80px;

	}


}