@charset "UTF-8";
/* CSS Document */
@media screen and (max-width:770px) {
:root {
  --ink: #173149;
  --ink-deep: #10283d;
  --blue:#287ba2;
  --text: #26465a;
  --muted: #607988;
  --paper: #f8fbfb;
  --mist: #e8f3f4;
  --mist-2: #d9edef;
  --mint: #70d7ca;
  --mint-soft: #c8f0e9;
  --sky: #a7dbe3;
  --cream: #f2f0dc;
  --pale:#f1f5f7;
  --line: rgba(23, 49, 73, .16);
  --max: 1480px;
  --pad: clamp(24px, 4vw, 72px);
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
  background: var(--paper);
  font-family: "Hiragino Kaku Gothic ProN", "Yu Gothic", "YuGothic", "Noto Sans JP", sans-serif;
  font-size: 16px;
  line-height: 1.9;
  letter-spacing: .04em;
  -webkit-font-smoothing: antialiased;
}
img {
  max-width: 100%;
  display: block;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  font: inherit;
}
#wrapper{
	position: relative;
	width: 100%;
	margin: auto;
}
#content{
    padding-top: 50px;
}
.box{
	width: 100%;
	margin: auto;
}
.box1{
	width: 90%;/* 1480px*/
	max-width: inherit;
	margin: auto;
}
.box2{
	width: 90%;/* 1380px*/
	max-width: inherit;
	margin: auto;
}
.base_grid1{
	display: grid;
	grid-template-columns: 1fr 1fr;
}
/*------*/
.or1{
	order: 1;
}
.or2{
	order: 2;
}
.item_c{
	align-items: center;
}
/*---------------------------------------------------------------------------------------------------------------*/
/* ----フォント関連 ----*/
.com_title1{
	font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
	font-weight: 700;
	letter-spacing: .04em;
	-webkit-font-smoothing: antialiased;
	font-size: 28px;/* 33px -17px*/
	line-height: 1.5;
}
.com_title2{
	font-family: "Noto Serif JP", serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-style: normal;
	font-size: 24px;/* 30px--- 16px */
	line-height: 1.5;
}
.com_title3{
	font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
	font-weight: 700;
	letter-spacing: .04em;
	-webkit-font-smoothing: antialiased;
	font-size: 25px;/* 33px -17px*/
	line-height: 1.5;
}
.com_title4{
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 700;
	font-optical-sizing: auto;
	font-style: normal;
	font-size: clamp(0.688rem, 0.153rem + 1.22vw, 1.375rem);/* 27px -> 15px */
	line-height: 1.5;
}
.en_title1{
	font-family: "M PLUS Rounded 1c", sans-serif;
	font-weight: 700;
	font-style: normal;
	line-height: 2;
}
.en_title2{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: clamp(1.188rem, 0.859rem + 0.89vw, 1.75rem);/* 28px */
	font-weight: 700;/* 700 */
	font-style: normal;
	line-height: 2;
}
.en_title3{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: clamp(1.563rem, 1.234rem + 0.89vw, 2.125rem);/* 34px */
	font-weight: 700;/* 700 */
	font-style: normal;
	line-height: 2;
}
.s_title{
	font-family: "Noto Serif JP", serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
	font-size: clamp(0.625rem, 0.074rem + 1.18vw, 1.25rem);/* 20px -> 10px*/
	line-height: 1.5;
}
.s_title2{
    display: inline-block;
    padding: 8px 30px;
	background: #56256e;
    font-family: "Noto Serif JP", serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
	font-size: 16px;/* 20px --> 13px*/
	line-height: 1;
    color: #FFFFFF;
	margin-bottom: 6px;
}
/*---------------  背景　---*/
.bg_ink{
	background: var(--ink);
}
.bg_blue{
	background: var(--blue);
}
.bg_pale{
	background: var(--pale);
}
/*------------------*/
.deep{
	color: var(--ink-deep);
}
.mint{
	color: var(--mint);
}
.paper{
	color: var(--paper);
}
/*--------------------*/
.m_top15{
	margin-top: 15px;
}
/*------ 装飾 ------*/
.square1{
	display: block;
	width: 50px;
	height: 50px;
	border-radius: 8px;
}
.square2{
	display: block;
	width: 70px;
	height: 70px;
	border-radius: 8px;
}
/*------------  改行　----*/
.pc_br{
	display: none;
}
.sp_br{
	display: block;;
}
 /*--------------------------------------  スマホヘッダー  ---*/
#sp_header{
    position: fixed;
    display: block;
    width: 100%;
    height: 50px;
    z-index: 1000;
    top: 0;
    left: 0;
    right: 0;
    background: var(--ink);
}
#sp-hd-logo{
		position: absolute;
		display: block;
		width: 50%;/* 250px */
		height: auto;
		margin: auto;
		top: 0;
		bottom: 0;
		left: 10px;
	}
	/* ▼メニュー（ハンバーガーアイコン）▼*/
	/*nabi開閉部分*/
	/*ハンバーガーボタン*/ 
	.gnav-btn{
		display: block;
		position: absolute;
		top: 0;/*24px*/
		bottom: 0;
		right: 10px;/*20px*/
		margin: auto;
		z-index: 3000;
		width: 11.5vw;/* 45px */
		height: 11.2vw;/* 45px */
	}
	   /*ハンバーガーボタン*/ 
		.icon-animation {
		width: 10vw;/*40px*/
		height: 10vw;/*40px*/
		display: block;
		cursor: pointer;
		float: right;
		position: absolute;
		margin: auto;
		right: 0;
		left: 0;
		top:0;
		text-align: center;
		color: #FFFFFF;
		}
		.icon-animation span {
		  width: 8vw;/*30px*/
		  height: 0.3vw;/*2px*/
		  display: block;
		  background: #FFFFFF;
		  position: absolute;
		  left: 50%;
		  top: 50%;
		  margin-left: -4vw;
		  -webkit-transition: all 0.3s;
		  transition: all 0.3s;
		  -webkit-transform: rotate(0deg);
		  -ms-transform: rotate(0deg);
		  transform: rotate(0deg);
		}
		.icon-animation .top {
		  -webkit-transform: translateY(-13px);
		  -ms-transform: translateY(-13px);
		  transform: translateY(-13px);
		}
		.icon-animation .bottom {
		  -webkit-transform: translateY(13px);
		  -ms-transform: translateY(13px);
		  transform: translateY(13px);
		}
		.is-open .middle {
		  background: rgba(51, 51, 51, 0);
		}
		.is-open .top {
		  -webkit-transform: rotate(-45deg) translateY(0px);
		  -ms-transform: rotate(-45deg) translateY(0px);
		  transform: rotate(-45deg) translateY(0px);
		}
		.is-open .bottom {
		  -webkit-transform: rotate(45deg) translateY(0px);
		  -ms-transform: rotate(45deg) translateY(0px);
		  transform: rotate(45deg) translateY(0px);
		}
		/* .global_nav */
	.global_nav {
		position: fixed;
		display: block;
		overflow: scroll;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		transform: translateX(100%);/* 360%*/
		padding-top: 0;
		background: var(--mist);
		transition: all 0.7s;
		z-index: 900;
	}
	/* .global_navに.activeが追加 */
	.global_nav.active {
		transform: translateX(0%);/* 240%*/
	}
	#global-menu{
		position: absolute;
		width: 90%;
		height: auto;
		list-style: none;
		top: 20%;/* 150px */
		left: 0;
		right: 0;
		margin: auto;
		overflow: hidden;
	}
	#global-menu a{
		display: block;
		color: var(--ink);
		text-decoration: none;
	}
	#global-menu li{
		font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
        font-weight: 700;
        font-size: 18px;/* 33px -17px*/
        line-height: 1.5;
        padding: 15px 6px ;/* 10px */
		transition: 1s;
	}
/*------------  ヘッダー    ----*/
header{
	display: none;
}
#hd_logo{
	display: none;
}
#hd_nav{
	display: none;
}
#hd_nav li{
	display: none;
}
#hd_nav li:hover{
	display: none;
}
.nav_cta {
	display: none;
}
.nav_cta a{
	display: none;
}
.nav_cta span {
  display: none;
}
/*------------  フッター  ------------*/
footer{
	padding: 40px 0 10px;
	background: var(--ink-deep);
	color: #b7cad2;
}
#in_footer{
	display: grid;
	grid-template-columns: 1fr;
	gap: 8vw;
	padding-bottom: inherit;
}
#ft_logo{
	display: block;
	width: 70%;/* 250px */
	height: auto;/* 70px */
	margin: auto;
}
#in_footer > p{
	margin: 0;
	line-height: 2;
	text-align: center;
}
#ft_menu{
	display: none;
}
#ft_copy{
	display: block;
	align-items: center;
	border-top: 1px solid rgba(255,255,255,.1);
	font-size: 14px;
	font-weight: 400;
	text-align: center;
}
/*------------------  下層ページのタイトル　-----------*/
#page_header{
	position: relative;
	background: var(--mist);
	padding: 20px 0 30px;
	overflow: hidden; /* 横方向のはみ出しを隠す */
}
#page_header::after{
	content: "";
	position: absolute;
	z-index: 0;
	right: -150px;
	top: 50px;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	border: 1px solid rgba(112,215,202,.22);
	box-shadow: 0 0 0 58px rgba(112,215,202,.035);
}
#page_inner p{
	display: flex;
	font-weight: 700;
	font-size: 12px;
	gap: 0 10px;
	line-height: 1;
	align-items: center;
}
#page_inner p > span{
	padding: 5px;
	background: var(--mint);
	color: #FFFFFF;
}
#page_title{
	font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
	font-weight: 700;
	letter-spacing: .04em;
	-webkit-font-smoothing: antialiased;
	font-size: 22px;/* 33px -17px*/
	line-height: 1.5;
}
/*------------------  お知らせ・コラム関係　-----------*/
.post_box{
	display: grid;
	grid-template-columns: 1fr;
	min-height: 700px;
	padding: 50px 0 80px;/* 120px 0 150px */
	gap: 15px;/* 50px 25px */
}
/*----*/
.post1{
	display: grid;
	grid-template-columns: .45fr .55fr;
	height: auto;/* 300px */
	background: var(--mist);
	padding: 5px;
	gap: 10px;
	align-items: center;
}
.post1 .post_img{
	width: 100%;
	aspect-ratio: 16 / 9;
	margin: 0;
	overflow: hidden;
}
.post1 .post_img img{
	display: block;
	width: 100%;
  	height: 100%;
	object-fit: cover;
}
.post_day{
	font-size: 10px;/* 12px */
	line-height: 1;
	color: var(--muted);
}
.post_title{
	font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
	font-weight: 700;
	font-size: 14px;/* 16px*/
	color: var(ink-deep);
}
/*---　永遠に横にスライダー ---*/
.marquee1 {
	position: absolute;
	width: 100%;
	height: 400px;/* 400px */
	display: flex;
	white-space: nowrap;
	overflow: hidden;
	bottom: 20px;/* 20px */
}
.item1{
}
.item2{
	position: absolute;
	display: inline-block;
	padding: 20px 40px;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-style: normal;
	color: rgba(160,216,239,0.2);
	line-height: 1;
	font-size: 240px;/* 240px */
	margin-right: 20px;/* 20px */
	z-index: -1;
	bottom: 10px;/* 10px */
}
.item3{
	position: absolute;
	display: inline-block;
	padding: 20px 40px;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-style: normal;
	color: #FFFFFF;
	-webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #dcdcdc;
	line-height: 1;
	font-size: 240px;
	margin-right: 20px;
	z-index: -1;
	bottom: 10px;
}
}