@charset "utf-8";

/* ==========================================================================
   Foundation
   ========================================================================== */
/* Reset
   ----------------------------------------------------------------- */

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,main,menu,nav.gnav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;font-weight:400;}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav.gnav,section{display:block}ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}
figure{margin-bottom:0;}
/* Base
   ----------------------------------------------------------------- */
body{
	font-family:"Noto Sans JP", sans-serif;
	font-weight:400;
	color:#111;
	font-feature-settings: "palt";/*文字詰め用*/
	letter-spacing:1px;
}

body#tw{
	font-family: "Noto Sans TC", sans-serif;
}
html {
  scroll-padding-top: 0px;
}
a{text-decoration:none;color:#111;}
a:hover{opacity:0.8;}
img{
	vertical-align:top;
	max-width:100%;
	height:auto;
}
ol{list-style:none}

/* ==========================================================================
   共通
========================================================================== */
html{font-size:16px;scroll-padding-top: 20px;}

/*文字寄せ*/
.txt-right{text-align:right;}
.txt-center{text-align:center;}
/*一文字空白*/
.indent{text-indent: 1em;}
/*URL改行防止*/
main p{word-break: break-all;}
@media screen and (min-width: 481px){
.sp480{display: none;}
}
/*mapレスポンシブ*/
.gmap {
height: 0;
overflow: hidden;
padding-bottom: 56.25%;
position: relative;
}
.gmap iframe {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}

/*tel スマホサイズのみクリック可*/
@media screen and (min-width: 769px) {
a[href*="tel:"] {
pointer-events: none;
cursor: default;
text-decoration: none;
}
}

@media screen and (min-width: 769px) {.sp768{display:none;}}
@media screen and (min-width: 481px) {.sp480{display:none;}}

/*共通ボタン*/
#btnfix{
	position:fixed;
	z-index:999;
	right:0px;
	bottom:0px;
}
#btnfix a{
display:inline-block;
background:#e5002d;
color:#fff;
padding:1.5rem;
font-size:clamp(14px, 2vw, 21px);
font-weight:bold;
border:solid 2px #e5002d;
}
#btnfix a:hover{
	opacity:1;
	color:#e5002d;
	background:#fff;
}
.btn {padding:2rem 2rem 6rem;}
.btn a{
	font-size:clamp(16px, 1.5vw, 18px);
	font-weight:bold;
	color:#fff;
	text-align:center;
	background:#223b8b;
	max-width:300px;
	box-sizing:border-box;
	line-height:45px;
	padding:.5rem;
	display: block;
	margin:0 auto;
	border:solid 3px #223b8b;
	border-radius:40px;
}
.btn a:hover{
	opacity: 1;
	background:#fff;
	color:#223b8b;
	border:solid 3px #223b8b;
}
@media screen and (max-width: 480px){
.btn a{line-height:25px;}
}

.btn2 {padding:2rem 0 2rem;}
.btn2 a{
	font-size:clamp(16px, 1.5vw, 18px);
	font-weight:bold;
	color:#333;
	text-align:center;
	background:#f7df00;
	max-width:240px;
	box-sizing:border-box;
	line-height:1.25rem;
	padding:.75rem .5rem;
	display: block;
	margin:0 auto;
	border:solid 3px #f7df00;
	border-radius:40px;
}
.btn2 a:hover{
	opacity: 1;
	color:#fff;
	background:#27ba3f;
}
@media screen and (max-width: 480px){
.btn2 a{line-height:25px;}
}

.link a{
	color:#464DA8;
	font-weight:bold;
}
.link a:after{
	content:"";
	display:inline-block;
	width:16px;
	height:14px;
	margin-top:2px;
	background-image:url(../img/icon01.png);
	background-repeat:no-repeat;
	background-size:auto 100%;
	margin-left:10px;
}

/*動画レスポンシブ*/
.movie-wrap{
	position: relative;
	padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
	height: 0;
	overflow: hidden;
	background:#ccc;
}
.movie-wrap iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


/*丸ドットのリスト*/
ul.list01{
	margin-bottom:1.5rem;
}
ul.list01 > li{
	font-size:clamp(13px, 1.5vw, 16px);
	line-height: 1.5em;
	padding:0 0 0 20px;
	position:relative;
	margin-bottom:.5rem;
}
ul.list01 > li:before{
	content: "";
	position: absolute;
	left: 5px;
	top: calc(1em - 8px);
	width: 8px;
	height: 8px;
	background: #333;
	display: block;
	border-radius: 10px;
}


/* ==========================================================================
   Layout
========================================================================== */
/* Header
----------------------------------------------------------------- */

header{
	position:relative;
	z-index:9;
}
#header-in{
	position:absolute;
	width:100%;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
}
.h-logo{flex:1;}
.h-logo .logo img{    filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.4));}
@media screen and (min-width: 769px) {
	.h-logo .logo{
	display:inline-block;
	padding:1rem;
	
}
}
@media screen and (max-width: 768px) {
	.h-logo .logo{
	display:inline-block;
	padding:10px;
	max-width:200px;
	
}
}

/*
@media screen and (max-width: 768px) {
	.h-logo .logo{max-width:250px;}
	
}
@media screen and (max-width: 520px) {
	.h-logo .logo{max-width:200px;padding:10px;}
}
@media screen and (max-width: 360px) {
	.h-logo .logo{max-width:150px;padding:10px;}
}
*/
.h_nav_sns{
	margin-left:auto;
	display:flex;
	flex-wrap:wrap;
	margin-right:10px;
}
.h_nav_sns li{
	max-width: 30px;
	padding: 10px 5px;
}
@media only screen and (max-width: 768px) {
	.h_nav_sns{margin-right:5px;}
	.h_nav_sns li{max-width: 24px;}
}
@media only screen and (max-width: 480px) {
	.h_nav_sns{
		position:fixed;
		left:0;
		bottom:0;
	}
}





.h_language{
	display:flex;
	flex-wrap:wrap;
	padding:1rem;
	background:#000;
}
.h_language li a{
	color:#fff;
	font-weight:bold;
	text-shadow:0 0 3px #555;
}
.h_language li:not(:last-child) a:after{
	content:"/";
	margin:0 0.5rem;
}
@media only screen and (max-width: 768px) {
	.h_language{
		padding: 14px 8px;
	}
	.h_language li a{font-size:12px;}
}
@media only screen and (max-width: 480px) {
.h_language{
		padding: 5px 8px;
	}
}
@media screen and (max-width: 360px) {

}




/*----ハンバーガー ここから----*/
/*ハンバーガーメニューの高さがはみ出した時のスクロールバー*/
.h_menu::-webkit-scrollbar{width: 8px;}
.h_menu::-webkit-scrollbar-track{background-color: #ddd;}
.h_menu::-webkit-scrollbar-thumb{background-color: #0088FF;}

/* メニューのスタイル */
.h_menu {
  position: fixed;
  top: 0;
  right: -100%;
  width: 100%;
  height: 100%;
  background-color: #315c99;
  color: fff;
  transition: right 0.8s ease; 
  padding: 120px 20px 20px 20px; 
  box-sizing: border-box;
  z-index: 999;
}
/* メニューが開いているとき */
.h_menu.open {right: 0;}
/* ボタンのスタイル */
.hamburger {
  position: fixed;
  top: 8px;
  right: 20px;
  width: 30px;
  cursor: pointer;
  z-index: 9999;
}
.hamburger span {
  display: block;
  height: 2px;
  width: 100%;
  background-color: #b4c7d3;
  margin: 8px 0;
  transition: 0.4s;
}

/* バツ印に変化するスタイル */
.hamburger.active span:nth-child(1) {transform: rotate(35deg) translate(8px, 8px);}
.hamburger.active span:nth-child(2) {opacity: 0;}
.hamburger.active span:nth-child(3) {transform: rotate(-35deg) translate(6px, -6px);}
@media only screen and (max-width: 768px) {
	.hamburger {
  position: fixed;
  top: 4px;
  right: 10px;
  cursor: pointer;
  z-index: 20;
}
}
@media screen and (max-width: 360px) {
	.hamburger {width: 25px;}
	.hamburger span{margin:6px 0; }
	.hamburger.active span:nth-child(1) {transform: rotate(35deg) translate(6px, 6px);}
}
/*メニューはスクロールするけど、裏のページは動かない*/
body.no-scroll {
  overflow: hidden;
  height: 100%;
}
/* メニューリストのスタイル */
.h_menu .h_nav li {
	margin-bottom:2rem;
}
.h_menu .h_nav li a {
	display:block;
	font-size:clamp(21px, 4vw, 32px);
	font-weight:bold;
	text-align:center;
	color:#fff;
}
.h_menu .h_nav li a span{
	font-size:15px;
	margin-top: 10px;
}
/*----ハンバーガー end----*/

/*追従*/

/*
header.m_fixed{
	width:100%;
	box-sizing: border-box;
	position:fixed;
	z-index:999;
	left:0;
	top:0;
	box-shadow:0 0 3px #ccc;
}
header.m_fixed .h-logo{
	max-width:400px;
}
@media screen and (max-width: 360px) {
	header.m_fixed .h-logo img{
	max-width:200px;
}
}

*/


/* footer
---------------------------------------------------------------- */
footer{background-color:#8F7D62;padding:1rem;}
footer address{
	color:#fff;
	text-align:center;
	font-style:normal;
	font-size:clamp(12px, 1.6vw, 16px);
}

/* ==========================================================================
   main
========================================================================== */
.sec{padding:6rem 4rem;}
@media screen and (max-width: 1400px){.sec{padding:4rem 3rem; }}
@media screen and (max-width: 480px){.sec{padding:3rem 2rem; }}
.inner{
	max-width:1280px;
	margin:0 auto;
}

/*見出し*/
h1,
h2,
h3,
h4,
h5{line-height:1.75em;}
p{line-height:1.75em;}

h1:not(.not){font-size:clamp(28px, 4vw, 32px);}
h2:not(.not){font-size:clamp(24px, 3vw, 28px);}
h3:not(.not){font-size:clamp(20px, 2vw, 24px);}
h4:not(.not){font-size:clamp(18px, 2vw, 21px);}
h5:not(.not){font-size:clamp(16px, 1.5vw, 18px);}
p,a{font-size:clamp(16px, 1.5vw, 18px);}

@media screen and (max-width: 320px){
h1:not(.not){font-size:24px;}
h2:not(.not){font-size:21px;}
h3:not(.not){font-size:18px;}
h4:not(.not){font-size:16px;}
h5:not(.not){font-size:14px;}
p,a{font-size:14px;}
}


h1:not(.not),
h2:not(.not),
h3:not(.not),
h4:not(.not){
	font-weight:bold;
}
h2:not(.not){margin-bottom:1rem;}
h3:not(.not),
h4:not(.not),
p{margin-bottom:1rem;}

.tit h2{
	font-size:clamp(24px, 3vw, 42px);
	font-weight:700;
	line-height:1.25em;
}

/*上下波型の背景*/
.wave-top1,
.wave-bottom1,
.wave-top2,
.wave-bottom2{
	position:relative;
	width: 100%;
	aspect-ratio:1265/45;
	background-repeat: no-repeat;
	background-size: 100% 100%;
}
.wave-top1,
.wave-bottom1{background-image: url("../img/bg-wave1.svg");}
.wave-top2,
.wave-bottom2{background-image: url("../img/bg-wave2.svg");}
.wave-top1,
.wave-top2{
	bottom:-2px;
}
.wave-bottom1,
.wave-bottom2{
	transform: rotate(180deg);
	top:-2px;
}
@media only screen and (max-width: 768px) {
.wave-top1,
.wave-bottom1,
.wave-top2,
.wave-bottom2{
	aspect-ratio: 16 / 1;
	background-size: auto 100%;
}
}
@media only screen and (max-width: 480px) {
.wave-top1,
.wave-bottom1,
.wave-top2,
.wave-bottom2{
	aspect-ratio: 10 / 1;
	background-size: auto 100%;
}
}
/* ==========================================================================
   コンテンツ別
========================================================================== */
#catch{
	background:#243e95;
	padding-bottom:80px;
	position:relative;
	margin-bottom:-30px;
	letter-spacing:2px;
}



@media screen and (max-width: 480px) {
	#catch{margin-bottom:-15px;}
}

#catch .topimg {position:relative;}
#catch .topimg .item-img{
	clip-path: polygon(0 0, 100% 0%, 100% 100%, 0 calc(100% - 60px));
	min-height: 400px;
	max-height:600px;
}
#catch .topimg .item-img img{
	object-fit: cover;
	height: 100%;
	width: 100%;
	min-height: 400px;
	position:relative;
	z-index:2;
}

#catch .topimg .item-txt{
	max-width:1280px;
	width:60%;
	position: absolute;
    top: 50%;
    left: 0%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
  padding-left:5%;
	z-index:4;
}
#catch .topimg .item-txt img{
	width:100%;
	max-width:600px;
	filter: drop-shadow(0px 0px 2px rgba(0,0,0, 0.4)); 
}
@media screen and (max-width: 768px) {
#catch .topimg .item-img{
	clip-path: polygon(0 0, 100% 0%, 100% 100%, 0 calc(100% - 40px));
	min-height: 400px;
	max-height:500px;
}
#catch .topimg .item-txt{
	width:100%;
	box-sizing: border-box;
    padding: 2rem;
}
}
@media screen and (max-width: 480px) {
#catch .topimg .item-img{
	clip-path: polygon(0 0, 100% 0%, 100% 100%, 0 calc(100% - 20px));
	min-height: 350px;
	max-height:400px;
}
}


#catch .cont{
	max-width:1280px;
	box-sizing: border-box;
	margin:0 auto 0;
	padding:2rem 2rem 1rem;
	position:relative;
	z-index:3;
}
@media screen and (min-width: 769px) {
#catch .cont{
	display:flex;
	flex-wrap:wrap;
}
#catch .cont .item-img{
	width:50%;
	max-width:560px;
	margin-left:1rem;
}
#catch .cont .item-img img{
	width:100%;
}
}
#catch .cont .item-txt{
	flex:1;
	color:#fff;
}
#catch .cont .item-txt h2{
	font-size:clamp(28px, 4vw, 50px);
	font-weight:bold;
	margin-bottom:2rem;
	line-height:1.25em;
}
#catch .cont .item-txt h2 span{
	font-size:clamp(18px, 2.75vw, 30px);
	display:block;
	line-height:1.25em;
	font-weight:bold;
	margin-bottom:1rem;
}
#catch .cont .item-txt .jissi{
	border:solid 2px #fff;
	padding:1rem;
	max-width:600px;
	margin-bottom:2rem;
	font-size:clamp(16px, 2vw, 24px);
	text-align:center;
	line-height:1.5em;
	font-weight:bold;
}

@media screen and (max-width: 768px) {
	#catch .cont .item-txt h2{text-align:center;}
	#catch .cont .item-img{text-align: right;margin-top:2rem;}
	#catch .cont .item-txt .jissi{font-size:20px;}
}
@media screen and (max-width: 400px) {
	#catch .cont{padding:2rem 1rem 1rem;}
}
/*5つの魅力*/
#highlights{
	background:#e1f4ff;
	padding:4rem;
}
.highlights-tit span{
	display:inline-block;
	padding:5px;
}
@media screen and (min-width: 769px) {
.highlights-tit{
	display:flex;
	align-items:center;
	justify-content:center;
	margin-bottom:4rem;
}
.highlights-tit span{
	display:inline-block;
	padding:5px;
}
.highlights-tit span:nth-child(1){margin-right:2rem;}
#highlights .inner{
	display:flex;
	max-width:1180px;
	align-items: center;
}
#highlights .inner h2{
	width:30%;
	margin-right:1.75em;
	max-width:350px;
}
#highlights .inner ul.point-list{
	flex:1;
}
}

#highlights .inner ul.point-list li{
	display:flex;
	flex-wrap:wrap;
	align-items: flex-start;
	margin-bottom:1.5rem;
	font-size:clamp(18px, 2.5vw, 24px);
	line-height:1.5em;
}
#highlights .inner ul.point-list li:before{
	content:"";
	display:block;
	width:24px;
	height:24px;
	background:url(../img/icon-check.svg) no-repeat 100% center;
	background-size:100% auto;
	margin-right:8px;
	margin-top:6px;
}
#highlights .inner ul.point-list li span{flex:1;}
@media screen and (max-width: 768px) {
#highlights {padding:4rem 3rem;}
	.highlights-tit{
	text-align:center;
	margin-bottom:4rem;
}
.highlights-tit span:nth-child(1){margin-bottom:1rem;}
.highlights-tit span:nth-child(2){width:100%;        box-sizing: border-box;}
#highlights .inner h2{margin-bottom:2rem;max-width: 230px;}
}

@media screen and (max-width: 480px) {
	#highlights {padding:4rem 1.5rem;}
	#highlights .inner h2{
		width:80%;
		margin: 0 auto 2rem;
	}
	
	#highlights .inner ul.point-list li{
		
	}
	#highlights .inner ul.point-list li .point{width:40px;line-height: 1.5rem;font-size:12px;}
	#highlights .inner ul.point-list li .point span{line-height: 1.5rem;}
	#highlights .inner ul.point-list li .txt{font-size:clamp(17px, 2vw, 21px);margin-left:0;}
	#highlights .inner ul.point-list li:before{width:20px;height:20px;margin-top:3px;}
}


/*参加無料キャンペーン参加者募集*/
#campaign{
	background:#243e95;
	color:#fff;
	padding: 2rem 2rem 4rem;
}
#campaign .tit{text-align: center;}
#campaign .tit .fukidashi{margin-bottom:1.5rem;}
#campaign .tit .fukidashi span{
	text-align:center;
	display:inline-block;
	position:relative;
	font-size:18px;
	font-weight:bold;
	padding:12px 1rem;
	background:#ECE501;
	color:#243e95;
}
#campaign .tit .fukidashi span:after{
	content:"";
	position:absolute;
	display:block;
	background:#ECE501;
	clip-path: polygon(0 0, 50% 100%, 100% 0);
	width:13px;
	height:9px;
	bottom: -8px;
	left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}
#campaign .tit h2{margin-bottom:2rem;}
#campaign .tit .hash{margin-bottom:2rem;}
#campaign .tit h3{margin-bottom:2rem;}

@media screen and (max-width: 480px) {
	#campaign{padding:1rem 1rem 3rem;}
	#campaign .tit .fukidashi span{font-size:15px;}
}


/*ハッシュタグ見本*/
.hash {
	display:flex;
	align-items:center;
	justify-content:center;
}
.hash .tag{
	font-size:20px;
	font-weight:bold;
	background:#fff;
	padding:1rem;
	border-radius:8px;
	color:#333;
}
.hash .rei{
	position:relative;
	padding-left:50px;
	font-size:20px;
}
.hash .rei:after{
	content:"";
	position:absolute;
	left:-10px;
	top:-8px;
	width:50px;
	height:25px;
	background:url(../img/himo.png) no-repeat center ;
	background-size:100% auto;
}
@media screen and (max-width: 768px) {
	.hash {flex-direction: column;}
	.hash .tag{margin-bottom:28px;font-size:16px;}
	.hash .rei{
		padding-left:0px;
		pdding-top:1rem;
		}
	.hash .rei:after{
		left:unset;
		right:0;
		top:-30px;
		transform: rotate(-30deg);
		}
}


#campaign .cont .tbl-box{
	margin-bottom:2rem;
}
#campaign .cont .tbl-box h4,
#campaign .cont .tbl-box p{
font-size:clamp(16px, 1.5vw, 19px);
padding:4px;
margin:0;
line-height:1.75rem;
	}
#campaign .cont .tbl-box h4{
	text-align:center;
	border:solid 1px #fff;
}


@media screen and (min-width: 769px) {
#campaign .cont .tbl-box{
	display:flex;
	flex-wrap:wrap;
	align-items: flex-start;

}
#campaign .cont .tbl-box h4{
	width:160px;
	margin-right:1rem;
}
#campaign .cont .tbl-box p{flex:1;}
}

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


}




#campaign .cont .keiyaku{
	background: #fff;
    color: #333;
    padding-bottom: 1px;
}


#campaign .cont .tbl-box p.kikan{
	font-size:clamp(18px, 2vw, 28px);
	line-height:2rem;
}

#campaign .cont .tbl-box p a{
	display:inline-block;
	color:#ECE501;
	font-weight:bold;
	font-size:clamp(13px, 1.5vw, 19px);
}
#campaign .keiyaku h4{
	text-align:center;
	background:#27ba3f;
	color:#fff;
	padding:8px;
	margin-bottom:1rem;
}
#campaign .keiyaku p{
	font-size:clamp(14px, 1.5vw, 16px);
	margin: 1rem 1rem;
}



/*スライダー*/
#highlights-slide{background:#243e95;padding: 0 0 3rem;}


/*参加方法*/
#how_to_entry .cont-in{
	padding:4rem 2rem;
}
#how_to_entry .h3_tit{
	font-size: clamp(21px, 4vw, 32px);
	background: #27ba3f;
	color: #fff;
	font-weight: bold;
	text-align: center;
	padding: 1.5rem;
}

@media screen and (max-width: 480px) {
#how_to_entry .cont-in{padding:3rem 1.5rem;}

}


.entry-list{margin-bottom:4rem;}
.entry-list > li{border-radius:15px;margin:2px;}

.entry-list > li h4{
	font-size:clamp(13px, 1.75vw, 21px);
	color: #27ba3f;

}
.entry-list > li .hash{margin-bottom:1rem;}
.entry-list > li .hash .tag{border: solid 2px #33be4a;line-height:1.5em;}

.entry-list > li p.min{font-size:clamp(13px, 1.25vw, 15px);}


@media screen and (min-width: 981px){
.entry-list{
	display:flex;
	flex-wrap:wrap;
}

.entry-list > li{
	flex: 1;
	display: flex;
	flex-direction: column;
	text-align: center;
	position:relative;
	padding:0 1rem;
}

.entry-list > li:before{
	content: "";
    position: relative;
    z-index: 1;
    display: block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    margin: 20px auto 20px;
		background:#315c99;
}
.entry-list > li:not(:last-child):after {
    content: "";
    position: relative;
		width:calc(100% + 2rem);
    top: 30px;
    left: 50%;
    height: 2px;
    background-color: #315c99;
    order: -1;
		z-index: 1;
}
.entry-list > li .num{
	position:absolute;
	top:-2rem;
	    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
	font-size:clamp(24px, 3vw, 42px);
	font-weight:bold;
	color:#315c99;
}
.entry-list > li .btn2{margin-top:auto;}
}
@media screen and (max-width: 980px){
.entry-list{
	max-width: 500px;
	margin: 0 auto;
}
.entry-list > li{
	position: relative;
	margin-bottom: 3rem;
	padding: 0 0 0 3rem;
}
.entry-list > li:before{
	content: "";
    position: absolute;
		left:20px;
		top:-8px;
    z-index: 1;
    display: block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    margin: 20px auto 20px;
		background:#315c99;
}
.entry-list > li:not(:last-child):after {
    content: "";
    position: absolute;
		width:2px;
		height:calc(100% + 40px);
    top: 20px;
    left: 30px;
    background-color: #315c99;
}
.entry-list > li .num{
	position:absolute;
	top:6px;
	    left: -8px;
	font-size:clamp(28px, 3vw, 40px);
	font-weight:bold;
	color:#315c99;
}
.entry-list > li h4{font-size:clamp(20px, 2.5vw, 32px);}
.entry-list > li .btn2 {padding:0;}
.entry-list > li .btn2 a{
	font-size:clamp(18px, 1.5vw, 20px);
	margin:0;
	
}
.entry-list > li p{font-size:clamp(16px, 1.5vw, 18px);line-height: 2em;}
.entry-list > li .hash{text-align:left;}

}

@media screen and (max-width: 480px){
	.entry-list > li .btn2 {padding:1rem 0;}
	.entry-list > li .btn2 a{font-size:16px;}
	.entry-list > li{padding:0 0 0 2rem;}
	.entry-list > li .num{font-size:24px;}
	.entry-list > li:before{width:12px; height:12px;left:11px;}
	.entry-list > li:not(:last-child):after{left: 16px;}
	
	
}
.entry-list > li .icon-list{
	margin: auto;
    display: flex;
    flex-wrap: wrap;

}
.entry-list > li .icon-list > li{
	    max-width: 40px;
    padding: 10px 10px;
}


.kinen-box{
	max-width:820px;
	margin:0 auto 2rem;
	box-sizing:border-box;
	padding:40px;
	background-image:url(../img/kinen.svg);
	background-repeat:no-repeat;
	background-position:right 20px bottom 20px;
	background-size:auto calc(100% - 40px);
	background-color:#27ba3f;
	position:relative;
	color:#fff;
}
.kinen-box:after{
	content: "";
	position: absolute;
	display: block;
	background: #27ba3f;
	clip-path: polygon(50% 0 , 100% 100%, 0 100% );
	width: 33px;
	height: 20px;
	top: -19px;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
}
.kinen-box h3{
	font-size:clamp(21px, 4vw, 32px);
	margin-bottom:1rem;
	font-weight:bold;
}
.kinen-box p{
	margin-bottom:0;
	font-size:clamp(14px, 1.5vw, 18px);
	font-weight:bold;
}
.kinen-box h3,
.kinen-box p{
	text-shadow:0 0 5px #555;
}

.kinen-box p strong{
	font-weight:bold;
	background:linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 70%, #f7df00 70%, #f7df00 100%);
}


@media screen and (max-width: 768px){
.kinen-box{background-size:30% auto;}

}
@media screen and (max-width: 480px){
	.kinen-box{padding:30px 30px 100px;}
}






/*ツアー紹介*/
#tour {
	background:#e1f4ff;
	padding:2rem 2rem 8rem 2rem;
	/*margin-bottom: -30px;*/
}
.tour-top{margin-top:-80px;}
@media screen and (min-width: 981px){
	#tour{/*margin-top:200px;*/}
	.tour-top{margin-top:200px;}
}
#tour .tit {
	text-align:center;
	margin-bottom:1.5rem;
}

#tour .tit .fukidashi{
	margin-bottom:1.5rem;
}
#tour .tit .fukidashi span{
	text-align:center;
	display:inline-block;
	position:relative;
	font-size:18px;
	font-weight:bold;
	padding:12px 1.5rem;
	background:#ECE501;
	color:#243e95;
}
#tour .tit .fukidashi span:after{
	content:"";
	position:absolute;
	display:block;
	background:#ECE501;
	clip-path: polygon(0 0, 50% 100%, 100% 0);
	width:13px;
	height:9px;
	bottom: -8px;
	left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}


#tour .cont{
	display:flex;
	flex-wrap:wrap;
	gap: 30px ;
}

#tour .cont .plan{
	width:calc((100% - 30px) / 2);
	box-sizing:border-box;
	position:relative;
	aspect-ratio: 2 / 1;
	object-fit:cover;
}

#tour .cont .plan .plan-img img{
	aspect-ratio: 2 / 1;
	object-fit:cover;
	width:100%;
	
}
#tour .cont .plan .plan-img{
	position:relative;
}

#tour .cont .plan .plan-tit{
	/*position:absolute;
	left:0;
	top:0;
	width:100%;
	aspect-ratio: 2 / 1;
	z-index:2;
	background:rgba(0,0,0,0.3);*/
	box-sizing:border-box;
	color:#fff;
	position:relative;
	left:0;
	background:#223b8b;
	padding:1rem 1rem;
	display:flex;
	flex-wrap:wrap;
	align-items: flex-start;
	min-height:8rem;
}

#tour .cont .plan .plan-tit .plan-no{
	display:flex;
	flex-direction:column;
	aspect-ratio: 1 / 1;
	align-items:center;
	justify-content:center;
	width:70px;
	margin-right:1rem;
	border:solid 1px #fff;
	font-weight:bold;
}
#tour .cont .plan .plan-tit .plan-no span{
	font-size:clamp(18px, 3vw, 28px);
	font-weight:bold;
}
#tour .cont .plan .plan-tit h4{
	flex:1;
}
#tour .cont .plan .plan-tit h4{
	color:#fff;
	font-size:clamp(16px, 2vw, 24px);
	line-height:1.5em;
	display:inline-block;
	margin-top:.25em;
}

#tour .cont .plan .qr{
	position:absolute;
	right:-5px;
	bottom:-5px;
	width:100px;
	aspect-ratio: 1 / 1;
	z-index:2;
	background:#fff;
	box-sizing:border-box;
	padding:0;
	box-shadow: 0 0 2px #ccc;
}

@media screen and (max-width: 1080px){
	/*#tour .cont .plan ,
	#tour .cont .plan .plan-img img,
	#tour .cont .plan .plan-tit{aspect-ratio: 3 / 2;}
	#tour .cont .plan .plan-tit {padding:20px;}*/
	#tour .cont .plan .plan-tit .plan-no{width:50px;}
	#tour .cont .plan .qr{width:70px;}
}


@media screen and (max-width: 768px){
	#tour .cont{display:block;max-width:480px;margin:0 auto;}
	#tour .cont .plan{width:100%;margin-bottom:20px;}
	#tour .cont .plan .plan-tit{min-height: unset;}
	/*#tour .cont .plan ,
	#tour .cont .plan .plan-img img,
	#tour .cont .plan .plan-tit{aspect-ratio: 3 / 2;}*/
}
@media screen and (max-width: 380px){
	/*#tour .cont .plan ,
	#tour .cont .plan .plan-img img,
	#tour .cont .plan .plan-tit{aspect-ratio: 3 / 2;}*/
}







/*絶景ポイントMAP*/
#point{
	padding:2rem;
	background:#243e95;
}

#point > .tit{
	max-width:1280px;
	box-sizing:border-box;
	margin:0 auto;
	
}
#point > .tit h2{margin-bottom:2rem;}
#point > .tit p{font-size:clamp(16px, 1.75vw, 20px);margin-bottom:2rem;}
#point > .tit .hash{margin-bottom:2rem;}
#point > .tit .item-txt{
	flex:1;
	color:#fff;
}


@media screen and (min-width: 1081px){
	#point > .tit{
		display:flex;
		flex-wrap:wrap;
		align-items: flex-end;
	}
	#point .tit .hash{justify-content:unset;}
	#point .tit .item-img{
	width:35%;
	margin-left:2rem;
	text-align:right;
}
}

@media screen and (max-width: 1080px){
	#point .tit h2{text-align:center;}
	#point .tit p{text-align:center;}
	#point .tit .item-txt{margin-bottom:2rem;}
	#point .tit .item-img{width:80%;margin:0 auto;text-align:center;}
}


#point .cont{
	max-width:1280px;
	box-sizing:border-box;
	margin:0 auto;
	background:#eef7fd;
	position:relative;
	display:flex;
	flex-wrap:wrap;
	padding:3rem 0 0 3rem;
	background-image:url(../img/bg_umi.png);
	background-size:30vw;
}


#point .cont .item-txt{
	width:55%;
	margin-bottom:4rem;
	position:relative;

}


#point .cont .flag-list li{
	position:relative;
	font-size:clamp(14px, 2.25vw, 24px);
	padding: 5px 0 5px 40px;
	line-height: 1.5em;
	margin-bottom:15px;
	cursor: pointer;
}
#point .cont .flag-list li:hover{
	opacity:0.8;
}


#point .cont .flag-list li img{
	position:absolute;
	left:0;
	top:0;
}
@media screen and (min-width: 821px){
#point .cont .item-img{
	flex:1;
	margin-top: auto;
	margin-left: -20%;
}

}



@media screen and (max-width: 820px){
	#point{padding:1rem;}
#point .cont .item-txt{margin-right:1rem;margin-bottom:-1rem;}
#point .cont{display:block;padding:1.5rem 0 0 0;}
#point .cont .item-txt{padding-left:1.5rem;}
#point .cont .item-txt{width:unset;}


#point .cont .item-img {overflow:hidden;}
#point .cont .item-img img{
	width:115vw;
	max-width:unset;
	position:relative;
	left:-22vw;
}


}



.popup_box:before{
	
	content: attr(data-en);
	position: absolute;
	top: -120px;
	left: 10px;
	color: #9fce7f;
	font-size: 200px;
	font-weight: 400;
	z-index: -1;
	font-family: "Damion", cursive;
}





/*かけはし号*/

#about{
	background-color:#e1f4ff;
	position: relative;
	top: -30px;
	margin-bottom:-30px;
	z-index:0;
}
.about-inner{
	position:relative;
	top:;
	padding-top:10rem;
}
.about-inner .item-txt{
	position:absolute;
	z-index:12;
	width:70%;
	max-width:;
	padding-left:4rem;
	top:7rem;
}
.about-inner .item-txt h2{
	background-color:#fff;
  width: fit-content;
	padding:1rem 2rem;
	margin-bottom:2rem;
}
.about-inner .item-txt p{margin-left:2rem;}
.about-inner .item-txt p span{
	background-color:#e1f4ff;
  width: fit-content;
	padding:6px 6px 6px 0;
	line-height:2.5em;
	font-size:clamp(14px, 1.75vw, 23px);
	font-weight:bold;
	color:#243e95;
}
.about-inner .item-txt .btn{text-align:left;}
.about-inner .item-txt .btn a{margin-left:0;}
.about-inner .item-img{
	width:calc(100% - 500px);
	max-width:1200px;
	object-fit:cover;
	margin-left:auto;
	position: relative;
    bottom: -200px;
		margin-top:-200px;
		z-index:9;
}
@media screen and (max-width: 1480px){
	.about-inner .item-txt{padding-left: 0;}
	.about-inner .item-img{width:calc(100% - 300px);}
}
@media screen and (max-width: 980px){
	.about-inner{display:flex;flex-direction: column-reverse;padding-top:0;}
	.about-inner .item-txt{
		position:unset;
		width:unset;
		        margin-right: 2rem;
		}
	.about-inner .item-txt h2{
		width:70%;
		display: flex;
    align-items: center;
		}
	.about-inner .item-img{
		bottom: -25px;
    margin-top: -25px;
		        width: calc(100% - 100px);
	}
}
@media screen and (max-width: 480px){
	.about-inner .item-img{
		bottom: -15px;
    margin-top: -15px;
		        width: calc(100% - 50px);
	}
}





/*



@media screen and (min-width: 1081px){
#event{margin-top:200px;}
}

#event{padding:6rem 0;}
#event .tit{
	text-align:center;
	margin:0 2rem 4rem;
}
#event .tit .fukidashi{margin-bottom:1.5rem;}
#event .tit .fukidashi span{
	text-align:center;
	display:inline-block;
	position:relative;
	font-size:18px;
	font-weight:bold;
	padding:8px 1.5rem;
	background:#27ba3f;
	color:#fff;
}
#event .tit .fukidashi span:after{
	content:"";
	position:absolute;
	display:block;
	background:#27ba3f;
	clip-path: polygon(0 0, 50% 100%, 100% 0);
	width:13px;
	height:9px;
	bottom: -8px;
	left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}
#event .tit h2{
	color:#27ba3f;
	line-height: 1.75em;
	margin-bottom:2rem;
}
#event .tit p{
	color:#27ba3f;
	font-size:clamp(14px, 2vw, 21px);
	font-weight:bold;
}
#event .tit p span{
	display:inline-block;
	font-weight:bold;
}
.hash{text-align:center;}
.hash span{
	display:inline-block;
	background:#eef7fd;
	font-weight:bold;
}
#event .tit .hash {margin-bottom:2rem;}
#event .tit .hash span{
	font-size: clamp(16px, 3vw, 42px);
	padding:1rem 1.5rem;
}
#event figure img{
	width:100%;
	height:300px;
	object-fit: cover;
}
@media screen and (max-width: 768px){
	#event{padding:3rem 0;}
	#event figure img{height:200px;}
}
@media screen and (max-width: 480px){
	#event figure img{height:150px;}
}
#event .cont h3.h3_tit{
	font-size:clamp(21px, 4vw, 32px);
	background:#27ba3f;
	color:#fff;
	font-weight:bold;
	text-align:center;
	padding:1.5rem;
}
#event .cont-in{margin:4rem 2rem 4rem;}






.note-box{
	max-width:820px;
	margin:0 auto 2rem;
	box-sizing:border-box;
	padding:40px;
	border:solid 1px #333;
}

@media screen and (max-width: 768px){
.note-box{padding:20px;}
}

*/


/*ご案内します*/
#caution{
	background:#e6f2e3;
	/*margin-top:2rem;*/
}




#caution .sub-tit{
	color:#0d3387;
	font-size:clamp(16px, 2.5vw, 24px);
	font-weight:bold;
}
#caution .guide-box{margin-bottom:4rem;}
#caution .guide-box p{line-height:2em;}

@media screen and (min-width: 769px){
#caution .guide01 {
	display:flex;
	flex-wrap:wrap;
	align-items: flex-start;
}
#caution .guide01 .guide-box{flex:1;}
#caution .guide01 .guide-img{
	width:40%;
	margin-left:2rem;
}
}
#caution .guide01{margin-bottom:4rem;}
#caution .guide01 h2{
	color:#0d3387;
	font-size:clamp(21px, 4vw, 32px);
	font-weight:bold;
}
#caution .guide01 p{
	font-size:clamp(13px, 1.5vw, 18px);
}

#caution .guide02 h2{
	color:#0d3387;
	padding:.5rem;
	background:#fff;
	display:flex;
	align-items:center;
}
@media screen and (min-width: 769px){
	#caution .guide02 .col{
	display:flex;
	gap:30px;
}
#caution .guide02 .col .item{
	width:calc((100% - 30px) / 2);
}
	
}


#caution .guide03 h2{
	color:#0d3387;
	padding:.5rem;
	background:#fff;
	display:flex;
	align-items:center;
}
#caution .guide03 h2 span{
	font-size:clamp(13px, 1.5vw, 18px);
}

@media screen and (min-width: 769px){
	#caution .guide03 .col{
		display:flex;
		gap:30px;
	}
	#caution .guide03 .col .item01{
		width:calc((100% - 30px) / 2);
	}
	#caution .guide03 .col .item02{
		width:calc((100% - 30px) / 2);
		display:flex;
		flex-wrap:wrap;
		flex-direction:column;
	}
	#caution .guide03 .col .item02 img{margin-top:auto;}
}

#caution .guide03 h3{
	background:#0d3387;
	color:#fff;
	padding:8px;
	
}
#caution .guide03 h4{
	color:#0d3387;
	margin-bottom:0;
	font-size:clamp(13px, 1.5vw, 18px);
}
#caution .guide03 p{
	font-size:clamp(13px, 1.5vw, 18px);
}
@media screen and (max-width: 480px){
	#caution .guide03 h2,
	#caution .guide03 h2 span{display:block;line-height:1.5em;}
}

/*むつ湾フェリーで楽しむ旅*/
#other .tit{
	font-size: clamp(21px, 4vw, 32px);
	background: #243e95;
	color: #fff;
	font-weight: bold;
	text-align: center;
	padding: 1.5rem;
}
#other .tit h2{margin:0;}

#other .cont{
	padding:4rem 2rem;
}
@media screen and (min-width: 769px){
#other .list-tabi{
	display:flex;
	flex-wrap:wrap;
	max-width:1200px;
	margin:0 auto 4rem;
}
#other .list-tabi li{
	width:calc((100% - 4rem) / 3);
	margin-right:2rem;
}
#other .list-tabi li:nth-child(3n){margin-right:0;}
}


@media screen and (max-width: 768px){
	#other .list-tabi li{margin-bottom:2rem;}
}


#other .list-tabi h3{
	text-align:center;
}
#other .list-tabi .photo,
#other .list-tabi .photo img{
	width: 100%;
	aspect-ratio: 3 / 2;
}
#other .list-tabi .photo{border:solid 1px #ccc;}


/*注意事項*/
#other .box{
	max-width:1080px;
	margin:0 auto;
	padding:2rem;
	box-sizing:border-box;
	border:solid 1px #ccc;
}
#other .box h4{color:#0D3387;}

@media screen and (max-width: 480px){
	#other .box{padding:1rem;}
}

/*フォームはこちら*/
#to-entry{
	background:#243e95;
	text-align:center;
}

#to-entry .tit h2{
	color: #fff;
	line-height: 1.75em;
	margin-bottom: 2rem;
}

#to-entry .hash .tag{
	font-size: clamp(16px, 2vw, 20px);
	padding: 1rem 1.5rem;
}
#to-entry .hash .rei{
	font-size: clamp(16px, 2vw, 20px);
	color:#fff;}


#to-entry .tit .fukidashi span{
	text-align: center;
	display: inline-block;
	position: relative;
	font-size: 18px;
	font-weight: bold;
	padding: 8px 1.5rem;
	background: #27ba3f;
	color: #fff;
}
#to-entry .tit .fukidashi span:after{
	content: "";
	position: absolute;
	display: block;
	background: #27ba3f;
	clip-path: polygon(0 0, 50% 100%, 100% 0);
	width: 13px;
	height: 9px;
	bottom: -8px;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
}
@media screen and (min-width: 769px) {
#to-entry .btn2 a{
	font-size: clamp(18px, 2vw, 24px);
	max-width:400px;
	    line-height: 2em;
}
}

#enquete{
	background:url(../img/enquete-bg.jpg) center / cover;
	background-repeat:no-repeat;
	background-color: rgba(0, 0, 0, 0.5);
	mix-blend-mode: overlay;
	text-align:center;
	margin :6rem 0;
	padding: 3rem 2rem;
	position:relative;
}
#enquete:after{
	content:"";
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
	background-color: rgba(0, 0, 0, 0.3);
	mix-blend-mode: multiply;
}

#enquete .tit{
	position:relative;
	z-index:2;
}
#enquete .tit h2{
	margin-top:.5em;
	color: #fff;
	line-height: 1.5em;
	margin-bottom: 1rem;
}


#enquete .tit .fukidashi span{
	    text-align: center;
    display: inline-block;
    position: relative;
    font-size: 18px;
    font-weight: bold;
    padding: 8px 1.5rem;
    background: #27ba3f;
    color: #fff;
}
#enquete .tit .fukidashi span:after{
	    content: "";
    position: absolute;
    display: block;
    background: #27ba3f;
    clip-path: polygon(0 0, 50% 100%, 100% 0);
    width: 13px;
    height: 9px;
    bottom: -8px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}
#enquete .tit .btn2{padding:0;}


@media screen and (min-width: 769px) {
#enquete .tit .btn2 a{
	font-size: clamp(18px, 2vw, 24px);
	max-width:400px;
	    line-height: 2em;
}
}

/*お問い合わせ*/
#contact h3{
	text-align:center;
	margin-bottom:3rem;
}
#contact .col .item h4{
	padding:3px 0;
	border-bottom: solid 1px #ddd;
}

@media screen and (min-width: 769px){
#contact .col{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
}
#contact .col .item{
	width:calc((100% - 2rem) / 2);
}

}

#follow h3{
	text-align:center;
	margin-bottom:3rem;
}


#follow .icon-list{
	margin: auto;
    display: flex;
    flex-wrap: wrap;
		justify-content: center;
}

#follow .icon-list li{
	    max-width: 40px;
    padding: 10px 10px;
}




/*20260508追加*/
#point .note{
	max-width:1280px;
	margin:1rem auto 0;
}
#point .note ul li{color:#fff;}
#point .note ul li:before{background: #fff;}