@charset "UTF-8";



/** 01. Buttons
 **************************************************************** **/
.btn.link-btn,
.link-btn {
	display: block;
	background: #db3561;
	color: #fff;
	border-radius: 50px;
	padding: 1em;
	text-align: center;
	font-size: 17px;
	border: 3px solid #db3561;
}

/* brown */
.btn.link-btn.btn-brown,
.link-btn.btn-brown {
	background: #CDBC9D;
	border: 3px solid #CDBC9D;
}

/* apua */
.btn.link-btn.btn-aqua,
.link-btn.btn-aqua {
	background: #2f98b7;
	border: 3px solid #2f98b7;
}

/* purple */
.btn.link-btn.btn-purple,
.link-btn.btn-purple {
	background: #C799E7;
	border: 3px solid #C799E7;
}

/* blue */
.btn.link-btn.btn-blue,
.link-btn.btn-blue {
	background: #7FADF1;
	border: 3px solid #7FADF1;
}

/* orange */
.btn.link-btn.btn-orange,
.link-btn.btn-orange {
	background: #F6D766;
	border: 3px solid #F6D766;
}

.btn.link-btn:hover,
.btn.btn-default.link-btn.disabled:hover {
	opacity: 0.8;
}

.btn-default.disabled.link-btn, .btn-default.link-btn.disabled:hover, .btn-default.link-btn.disabled:focus, .btn-default.link-btn.disabled.focus, .btn-default.link-btn.disabled:active, .btn-default.link-btn.disabled.active, .btn-default.link-btn[disabled], .btn-default.link-btn[disabled]:hover, .btn-default.link-btn[disabled]:focus, .btn-default.link-btn[disabled].focus, .btn-default.link-btn[disabled]:active, .btn-default.link-btn[disabled].active, fieldset[disabled] .btn-default.link-btn, fieldset[disabled] .btn-default.link-btn:hover, fieldset[disabled] .btn-default.link-btn:focus, fieldset[disabled] .btn-default.link-btn.focus, fieldset[disabled] .btn-default:active, fieldset[disabled] .btn-default.link-btn.active {
	background: #db3561;
	border-color: #db3561;
	color: #fff;
}

@media (max-width: 768px) {
	.btn.link-btn,.link-btn {
		font-size: 2vw;
	}

	.btn.link-btn.r20,.link-btn.r20 {
		border-radius: 20px;
		padding: 0.5em;
	}
}

@media (max-width: 650px) {
	.btn.link-btn,
	.link-btn {
		font-size: 2.5vw;
	}
}

@media (max-width: 480px) {
	.btn.link-btn,
	.link-btn {
		font-size: 3.5vw;
	}
	
}


/******************ボーダーボタン内のラベル*******************/
.btn.link-btn .label-default.label-outline,
.link-btn .label-default.label-outline {
	background-color:#fff;
	border: solid 0px #db3561;
	color: #db3561;
}

/* apua */
.btn.link-btn.btn-aqua .label-default.label-outline,
link-btn.btn-aqua .label-default.label-outline {
	background-color:#fff;
	border: solid 0px #2f98b7;
	color: #2f98b7;
}

/* brown */
.btn.link-btn.btn-brown .label-default.label-outline,
.link-btn.btn-brown .label-default.label-outline {
	background-color:#fff;
	border: solid 0px #CDBC9D;
	color: #A18B63;
}

/* purple */
.btn.link-btn.btn-purple .label-default.label-outline,
.link-btn.btn-purple .label-default.label-outline {
	background-color:#fff;
	border: solid 0px #C799E7;
	color: #C799E7;
}

/* blue */
.btn.link-btn.btn-blue .label-default.label-outline,
.link-btn.btn-blue .label-default.label-outline {
	background-color:#fff;
	border: solid 0px #7FADF1;
	color: #7FADF1;
}






/** 02. 矢印
 **************************************************************** **/
.down_yajirushi {
	margin: 30px auto -10px;
	position: relative;
	width: 0;
	height: 0;
	border: 20px solid transparent;
	border-top-color: #0097cf;
}

.down_yajirushi::after {
	position: absolute;
	content: '';
	top: -39px;
	left: -10px;
	width: 20px;
	height: 20px;
	background: #0097cf;
}


/******************矢印の色 brown*******************/
.down_yajirushi.brown {
	border-top-color: #CDBC9D;
	margin: 60px auto -10px;
}

.down_yajirushi.brown::after {
	position: absolute;
	content: '';
	top: -69px;
	left: -10px;
	width: 20px;
	height: 50px;
	background: #CDBC9D;
}

.down_yajirushi.brown.icon_train::before,.icon_train::before {
	position: relative;
	top: -69px;
	left: 10px;
	content: url(../images/icon/icon_train.png);
	display: inline-block;
	width: 20px;
	height: 20px;
}

.down_yajirushi.brown.icon_walk::before {
	position: relative;
	top: -69px;
	left: 10px;
	content: url(../images/icon/icon_walk.png);
	display: inline-block;
	width: 20px;
	height: 20px;
}

.down_yajirushi.brown.icon_bus::before {
	position: relative;
	top: -69px;
	left: 10px;
	content: url(../images/icon/icon_bus.png);
	display: inline-block;
	width: 20px;
	height: 20px;
}


/* 矢印の長さ short */
.down_yajirushi.brown.short {
	border-top-color: #CDBC9D;
	margin: 20px auto -10px;
}

.down_yajirushi.brown.short::after {
	position: absolute;
	content: '';
	top: -29px;
	left: -10px;
	width: 20px;
	height: 10px;
	background: #CDBC9D;
}


/* 矢印の長さ long */
.down_yajirushi.brown.long {
	margin: 220px auto -5px;
	position: relative;
	width: 0;
	height: 0;
	border: 20px solid transparent;
	border-top-color: #CDBC9D;
}

.down_yajirushi.brown.long::after {
	position: absolute;
	content: '';
	top: -230px;
	left: -10px;
	width: 20px;
	height: 210px;
	background: #CDBC9D;
}

/* 矢印の長さ long2 */
.down_yajirushi.brown.long2 {
	margin: 220px auto -5px;
	position: relative;
	width: 0;
	height: 0;
	border: 20px solid transparent;
	border-top-color: #CDBC9D;
}

.down_yajirushi.brown.long2::after {
	position: absolute;
	content: '';
	top: -230px;
	left: -10px;
	width: 20px;
	height: 210px;
	background: #CDBC9D;
}

@media (max-width: 480px) {
	.down_yajirushi.brown.long2 {
		margin: 170px auto -5px;
		position: relative;
		width: 0;
		height: 0;
		border: 20px solid transparent;
		border-top-color: #CDBC9D;
	}

	.down_yajirushi.brown.long2::after {
		position: absolute;
		content: '';
		top: -180px;
		left: -10px;
		width: 20px;
		height: 160px;
		background: #CDBC9D;
	}
}



/******************矢印の色 purple*******************/
.down_yajirushi.purple {
	border-top-color: #C799E7;
}

.down_yajirushi.purple::after {
	position: absolute;
	content: '';
	top: -39px;
	left: -10px;
	width: 20px;
	height: 20px;
	background: #C799E7;
}


/* 矢印の長さ long */
.down_yajirushi.purple.long {
	margin: 200px auto -5px;
	position: relative;
	width: 0;
	height: 0;
	border: 20px solid transparent;
	border-top-color: #C799E7;
}

.down_yajirushi.purple.long::after {
	position: absolute;
	content: '';
	top: -210px;
	left: -10px;
	width: 20px;
	height: 190px;
	background: #C799E7;
}

/* 矢印の長さ long2 */
.down_yajirushi.purple.long2 {
	margin: 200px auto -5px;
	position: relative;
	width: 0;
	height: 0;
	border: 20px solid transparent;
	border-top-color: #C799E7;
}

.down_yajirushi.purple.long2::after {
	position: absolute;
	content: '';
	top: -210px;
	left: -10px;
	width: 20px;
	height: 190px;
	background: #C799E7;
}

@media (max-width: 480px) {
	.down_yajirushi.purple.long2 {
		margin: 150px auto -5px;
		position: relative;
		width: 0;
		height: 0;
		border: 20px solid transparent;
		border-top-color: #C799E7;
	}

	.down_yajirushi.purple.long2::after {
		position: absolute;
		content: '';
		top: -160px;
		left: -10px;
		width: 20px;
		height: 140px;
		background: #C799E7;
	}
}



/******************矢印の色 blue*******************/
.down_yajirushi.blue {
	border-top-color: #7FADF1;
}

.down_yajirushi.blue::after{
	position: absolute;
	content: '';
	top: -39px;
	left: -10px;
	width: 20px;
	height: 20px;
	background: #7FADF1;
}


/* 矢印の長さ long */
.down_yajirushi.blue.long {
	margin: 190px auto -5px;
	position: relative;
	width: 0;
	height: 0;
	border: 20px solid transparent;
	border-top-color: #7FADF1;
}

.down_yajirushi.blue.long::after{
	position: absolute;
	content: '';
	top: -200px;
	left: -10px;
	width: 20px;
	height: 180px;
	background: #7FADF1;
}

/* 矢印の長さ long2 */
.down_yajirushi.blue.long2 {
	margin: 190px auto -5px;
	position: relative;
	width: 0;
	height: 0;
	border: 20px solid transparent;
	border-top-color: #7FADF1;
}

.down_yajirushi.blue.long2::after {
	position: absolute;
	content: '';
	top: -200px;
	left: -10px;
	width: 20px;
	height: 180px;
	background: #7FADF1;
}

@media (max-width: 480px) {
	.down_yajirushi.blue.long2 {
		margin: 150px auto -5px;
		position: relative;
		width: 0;
		height: 0;
		border: 20px solid transparent;
		border-top-color: #7FADF1;
	}
	
	.down_yajirushi.blue.long2::after {
		position: absolute;
		content: '';
		top: -160px;
		left: -10px;
		width: 20px;
		height: 140px;
		background: #7FADF1;
	}
}







/** 03. bootstrap row 調整
 **************************************************************** **/
.row.mg3 {
	margin-right: -3px;
	margin-left: -3px;
}

.row.mg3 .col-7,
.row.mg3 .col-6,
.row.mg3 .col-5 {
	position: relative;
	min-height: 1px;
	padding-right: 3px;
	padding-left: 3px;
}








/** 04. module 色追加
 **************************************************************** **/
.module-brown {
	background-color: #e0d6c5;
}






/** 05. marker 色追加
 **************************************************************** **/
/* purple */
.marker.purple.thin {
	color: inherit;
	background: linear-gradient(transparent 70%, #cfbddc 70%);
}

/* blue */
.marker.blue.thin {
	color: inherit;
	background: linear-gradient(transparent 70%, #b0caf1 70%);
}




