@charset "utf-8";

/* ------ Icon ------ */
.i_bg i{
	position: absolute;
	z-index: 0;
	opacity: 0;
}

.utext *{
	color: #fff;
}

/* =========================================================
page-ttl
========================================================= */
#page-ttl{
	background-image: url(../../img/course/header_s_bg_pc.jpg);
}
@media only screen and (max-width: 750px){
	#page-ttl{
		background-image: url(../../img/course/header_s_bg_sp.jpg);
	}
}


/* =========================================================
course
========================================================= */
#course {
	position: relative;
	background-color: #0076a9;
}
#course .inner {
}
#course .i_bg .i_cloud02a {
	width: 1.9rem;
	bottom: 6.1rem;
	left: 50%;
	margin-left: 8.6rem;
}
#course .i_bg .i_cloud02a:before {
	background-color: #d4ecf3;
}
#course .i_bg .i_cloud02b {
	width: 3.7rem;
	bottom: 7.4rem;
	left: 50%;
	margin-left: 12.2rem;
}
#course .i_bg .i_cloud02b:before {
	background-color: #d4ecf3;
}
#course .i_bg .i_ship01 {
	width: 7rem;
	bottom: -0.4rem;
	left: 50%;
	margin-left: 23rem;
	z-index: 2;
}
#course .i_bg .i_ship01:before {
	background-color: #d4ecf3;
}
#course .i_bg .i_wave01 {
	width: 12.3rem;
	bottom: -4.6rem;
	right: -0.1rem;
}
#course .i_bg .i_wave01:before {
	background-color: #d4ecf3;
}
@media only screen and (max-width: 750px){
	#course .i_bg .i_cloud02a {
		width: 0.19rem;
		bottom: 0.62rem;
		left: 2.68rem;
		margin-left: 0;
	}
	#course .i_bg .i_cloud02b {
		width: 0.37rem;
		bottom: 0.75rem;
		left: 3.04rem;
		margin-left: 0;
	}
	#course .i_bg .i_ship01 {
		width: 0.7rem;
		bottom: -0.03rem;
		left: 4.12rem;
		margin-left: 0;
	}
	#course .i_bg .i_wave01 {
		width: 1.23rem;
		bottom: -0.46rem;
		right: -0.01rem;
	}
}


/* =========================================================
course_illust
========================================================= */
#course_illust {
	margin-bottom: 6rem;
}
#course_illust .img {
	overflow: hidden;
	width: 100%;
	position: relative;
	z-index: 1;
	border-radius: 2rem;
}
#course_illust .img .bg{
	width: 100%;
	height: 0;
	padding-top: 35.088%;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}
#course_illust .img img {
	display: none;
}
@media only screen and (max-width: 750px){
	#course_illust {
		margin-bottom: 0.6rem;
	}
	#course_illust .img {
		border-radius: 0.2rem;
	}
}


/* =========================================================
course_info
========================================================= */
#course_info {
	display:flex;
	display:-webkit-flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	flex-flow: row nowrap;
	-webkit-flex-flow: row nowrap;
	align-items: stretch;
	-webkit-align-items: stretch;
	width: 100%;
}
@media only screen and (max-width: 750px){
	#course_info {
		display: block;
	}
}


/* =========================================================
course_left
========================================================= */
#course_left {
	width: 54.39%;
	margin-right: 5.26%;
}
#course_left.noimg {
	display: none;
}
#course_left .img_area {
}
#course_left .img_area .main_img {
	overflow: hidden;
	width: 100%;
	position: relative;
	z-index: 1;
	display: block;
}
#course_left .img_area .main_img.vertical {
	border-radius: 0;
}
#course_left .img_area .main_img.vertical:before{
	content: "";
	width: 100%;
	height: 0;
	padding-top: 100%;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: center top;
	background-size: contain;
	display: block;
}
#course_left .img_area .main_img img {
	width: 100%;
	overflow: hidden;
	border-radius: 2rem;
	display: block;
}
#course_left .img_area .main_img.vertical img {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin:0 auto;
	width: auto;
	height: 100%;
}
.grid:after {
	display: block;
	clear: both;
	content: '';
}
.grid .grid-item {
	float: left;
}
.grid-sizer,
.grid-item {
  width: 47.58%;
}
.gutter-sizer {
  width: 4.84%;
}
#course_left .img_area .sub_img {
/*	display:flex;
	display:-webkit-flex;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	flex-flow: row wrap;
	-webkit-flex-flow: row wrap;
	align-items: flex-start;
	-webkit-align-items: flex-start;*/
	margin-top: 3rem;
}
#course_left .img_area .sub_img .grid-item {
	overflow: hidden;
	width: 100%;
	position: relative;
	z-index: 1;
	display: block;
}
#course_left .img_area .sub_img .grid-item {
	width: 47.58%;
	/*margin-right: 4.84%;*/
	margin-bottom: 2.5rem;
}
#course_left .img_area .sub_img .grid-item .img {
	overflow: hidden;
	width: 100%;
	position: relative;
	z-index: 1;
	display: block;
}
#course_left .img_area .sub_img .img.vertical{
	border-radius: 0;
}
#course_left .img_area .sub_img .img.vertical:before{
	content: "";
	width: 100%;
	height: 0;
	padding-top: 100%;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: center top;
	background-size: contain;
	display: block;
}
#course_left .img_area .sub_img .img img {
	width: 100%;
	overflow: hidden;
	border-radius: 2rem;
	display: block;
}
#course_left .img_area .sub_img .img.vertical img {
	position: absolute;
	top: 0;
	left: 0;
	margin:0;
	width: auto;
	height: 100%;
}
#course_left .img_area .sub_img .grid-item .txt {
	color: #fff;
	line-height: 1.7em;
	margin-top: 1.3rem;
	letter-spacing: 0;
}
@media print, screen and (max-width: 900px) and (min-width: 751px),(max-device-width: 1024px) and (min-device-width: 768px){
	#course_left {
		width: calc(100% - 36rem);
		margin-right: auto;
	}
}
@media only screen and (max-width: 750px){
	#course_left {
		width: 100%;
		margin-right: 0;
		margin-bottom: 0.43rem;
	}
	#course_left .img_area .main_img img {
		border-radius: 0.2rem;
	}
	#course_left .img_area .sub_img {
		margin-top: 0.3rem;
	}
	.grid-sizer,
	.grid-item {
	  width: 47.86%;
	}
	.gutter-sizer {
	  width: 4.28%;
	}
	#course_left .img_area .sub_img .grid-item {
		margin-bottom: 0.25rem;
	}
	#course_left .img_area .sub_img .img img {
		border-radius: 0.2rem;
	}
	#course_left .img_area .sub_img .grid-item .txt {
		line-height: 1.4em;
		margin-top: 0.13rem;
	}
}


/* =========================================================
course_right
========================================================= */
#course_right {
	width: 40.35%;
}
#course_left.noimg + #course_right {
	width: 100%;
}
#course_right .period {
	color: #fff462;
	font-size: 1.8rem;
	font-weight: 500;
	letter-spacing: 0.05em;
	margin-bottom: 1.6rem;
	margin-top: -0.3rem;
}
#course_right h3 {
	color: #fff462;
	font-size: 3.2rem;
	font-weight: 700;
	line-height: 1.3em;
}
#course_right .utext{
	margin-top: 2.1rem;
}
#course_right .captain_bloc {
	display: flex;
	display: -webkit-flex;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	flex-flow: row nowrap;
	-webkit-flex-flow: row nowrap;
	align-items: flex-end;
	-webkit-align-items: flex-end;
	margin-top: 2.5rem;
}
#course_right .captain_bloc .img {
	width: 8rem;
	border-radius: 1rem;
	overflow: hidden;
}
#course_right .captain_bloc .img .bg {
}
#course_right .captain_bloc .img img {
}
#course_right .captain_bloc .txt {
	display: block;
	text-align: left;
	margin-left: 3rem;
	margin-bottom: 1.5rem;
}
#course_right .captain_bloc .txt .ship_name {
	color: #fff;
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1em;
	position: relative;
	z-index: 3;
	margin-bottom: 1.8rem;
}
#course_right .captain_bloc .txt .captain_name {
	display: flex;
	display: -webkit-flex;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	flex-flow: row nowrap;
	-webkit-flex-flow: row nowrap;
	align-items: center;
	-webkit-align-items: center;
}
#course_right .captain_bloc .txt .captain_name span:not(.name) {
	color: #fff;
	font-size: 1.8rem;
	font-weight: 700;
	margin-right: 1.8rem;
	letter-spacing: 0;
}
#course_right .captain_bloc .txt .captain_name .name {
	color: #fff;
	font-size: 2.4rem;
	font-weight: 700;
	letter-spacing: 0.02em;
}
#course_right .tbl_def {
	margin-top: 3rem;
}
#course_right .gmap_box {
	position: relative;
	z-index: 1;
	margin-top: 3rem;
}
#course_right .gmap_box iframe {
	width: 100%;
	height: 24rem;
	vertical-align: top;
	border: none;
}
#course_right.noimg .gmap_box iframe{
	height: 50rem;
}
#course_right .btn_area {
	display:flex;
	display:-webkit-flex;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	flex-flow: row wrap;
	-webkit-flex-flow: row wrap;
	align-items: lex-start;
	-webkit-align-items: lex-start;
	width: 100%;
	margin-top: 3rem;
}
#course_right .btn_area .btn_def{
	width: 100%;
	max-width:100%;
	margin-bottom: 3rem;
}
#course_right .btn_area .btn_ellipse {
	width: 47.82%;
	margin-right: 4.36%;
}
#course_right .btn_area .btn_ellipse:last-child {
	margin-right: 0;
}
@media print, screen and (max-width: 900px) and (min-width: 751px),(max-device-width: 1024px) and (min-device-width: 768px){
	#course_right {
		width: 34rem;
	}
}
@media only screen and (max-width: 750px){
	#course_right {
		width: 100%;
	}
	#course_right .period {
		font-size: 0.32rem;
		margin-bottom: 0.1rem;
		margin-top: 0;
		letter-spacing: 0.03em;
	}
	#course_right h3 {
		font-size: 0.52rem;
	}
	#course_right .utext {
		margin-top: 0.13rem;
	}
	#course_right .captain_bloc {
		margin-top: 0.23rem;
	}
	#course_right .captain_bloc .img {
		width: 1.6rem;
		border-radius: 0.1rem;
	}
	#course_right .captain_bloc .txt {
		margin-left: 0.6rem;
		margin-bottom: 0.4rem;
	}
	#course_right .captain_bloc .txt .ship_name {
		font-size: 0.26rem;
		margin-bottom: 0.25rem;
	}
	#course_right .captain_bloc .txt .captain_name span:not(.name) {
		font-size: 0.26rem;
		margin-right: 0.26rem;
	}
	#course_right .captain_bloc .txt .captain_name .name {
		font-size: 0.36rem;
	}

	#course_right .tbl_def {
		margin-top: 0.3rem;
	}
	#course_right .gmap_box {
		margin-top: 0.3rem;
	}
	#course_right .gmap_box iframe {
		height: 3.65rem;
	}
	#course_right.noimg .gmap_box iframe{
		height: 5rem;
	}
	#course_right .btn_area {
		margin-top: 0.3rem;
	}
	#course_right .btn_area .btn_def{
		margin-bottom: 0.3rem;
	}
	#course_right .btn_area .btn_ellipse {
		width: 47.86%;
		margin-right: 4.28%;
	}
}


/* =========================================================
calendar
========================================================= */
#calendar {
	background-color: #d4ecf3;
	position: relative;
	z-index: 1;
	overflow: hidden;
}
#calendar .inner_box1 {
	padding-bottom: 0;
}
#calendar .inner_box2 {
	padding-top: 0;
	padding-bottom: 18rem;
}
#calendar h3 {
	margin-bottom: 5.4rem;
}
#calendar .i_bg .i_wave02 {
	width: 12.3rem;
	bottom: -4.6rem;
	left: -0.1rem;
	z-index: 2;
}
#calendar .i_bg .i_wave02:before {
	background-color: #fff;
}
#calendar .i_bg .i_bird02a {
	width: 10.6rem;
	bottom: 7.8rem;
	left: 50%;
	margin-left: 5.1rem;
}
#calendar .i_bg .i_bird02a:before {
	background-color: #fff;
}
#calendar .i_bg .i_cloud05 {
	width: 67.2rem;
	bottom: -0.2rem;
	left: 50%;
	margin-left: 8.5rem;
}
#calendar .i_bg .i_cloud05:before {
	background-color: #fff;
}
@media only screen and (max-width: 750px){
	#calendar .inner_box2 {
		padding-bottom: 1.8rem;
	}
	#calendar h3 {
		margin-bottom: 0.52rem;
	}
	#calendar .scroll_help1{
		width: 100%;
		padding-left: 0.2rem;
		padding-right: 0.2rem;
		margin-bottom: 0.25rem;
	}
	#calendar .scroll_help2{
		margin-top: 0.25rem;
		margin-bottom: 0.6rem;
	}
	#calendar .i_bg .i_wave02 {
		width: 1.23rem;
		bottom: -0.46rem;
		left: -0.01rem;
	}
	#calendar .i_bg .i_bird02a {
		width: 1.06rem;
		bottom: 0.86rem;
		left: 2.76rem;
		margin-left: 0;
	}
	#calendar .i_bg .i_cloud05 {
		width: 6.72rem;
		bottom: -0.02rem;
		left: 3.1rem;
		margin-left: 0;
	}
}


/* =========================================================
nplink
========================================================= */
#nplink{
	display:         flex;
	display: -webkit-flex;
	-webkit-justify-content: flex-start;
	        justify-content: flex-start;
	        flex-flow: row wrap;
	-webkit-flex-flow: row wrap;
	        align-items: flex-start;
	-webkit-align-items: flex-start;
	width: 100%;
	padding: 0 2rem;
	margin-bottom: 1.2rem;
}
#nplink .btn_ellipse {
	width: 15rem;
	margin: 0 2rem 2rem 0;
}
#nplink .btn_ellipse span {
	font-size: 1.4rem;
	letter-spacing: 0.02em;
}
#nplink .btn_ellipse i {
	font-size: 1.4rem;
}
#nplink .btn_ellipse.disable{
	opacity: 1 !important;
	background-color: #b3b3b3 !important;
	border-color: #b3b3b3 !important;
	cursor: default;
}
#nplink .btn_ellipse.disable span{
	color: #fff !important;
}
#nplink .btn_ellipse.disable i{
	color: #fff !important;
	-webkit-transform: scale(1,1) !important;
	transform: scale(1,1) !important;
}
#nplink .btn_ellipse.disable .bg{
	display: none;
}
#nplink .prev {
	margin-right: auto;
}
#nplink .prev .btn_ellipse{
	margin-left: 0;
	margin-right: 5rem;
	padding: 0.3rem 1.8rem 0.5rem 2.8rem;
}
#nplink .prev .btn_ellipse i{
	left: 0.9rem;
}
#nplink .next {
	margin-left: auto;
}
#nplink .next .btn_ellipse {
	margin-right: 0;
	margin-left: 5rem;
	padding: 0.3rem 2.8rem 0.5rem 1.8rem;
}
#nplink .next .btn_ellipse i{
	right: 0.9rem;
}
@media only screen and (max-width: 750px){
	#nplink {
		padding: 0 0.25rem;
		margin-bottom: 0.12rem;
	}
	#nplink .btn_ellipse {
		width: 2.15rem;
		height: 0.6rem;
		margin: 0 0.275rem 0.2rem 0;
	}
	#nplink .btn_ellipse:nth-child(3n) {
		margin-right: 0;
	}
	#nplink .btn_ellipse span {
		font-size: 0.26rem;
	}
	#nplink .btn_ellipse i {
		font-size: 0.26rem;
	}
}

/* =========================================================
bkg
========================================================= */
#bkg{
	position: relative;
	z-index: 1;
}
#bkg .monthly-calendar{
	margin: 0 auto 6rem;
}
#bkg .monthly-calendar:last-child{
	margin-bottom: 0;
}
#bkg .monthly-calendar .caption{
	position: relative;
	z-index: 1;
	display:         flex;
	display: -webkit-flex;
	-webkit-justify-content: flex-start;
	        justify-content: flex-start;
	        flex-flow: column wrap;
	-webkit-flex-flow: column wrap;
	        align-items: center;
	-webkit-align-items: center;
	width: 15rem;
	margin: 0 auto 3.2rem;
}
#bkg .monthly-calendar .caption .date_y{
	font-size: 2.4rem;
	font-weight: 900;
	line-height: 1em;
	margin-bottom: 0.3rem;
}
#bkg .monthly-calendar .caption .date_m{
	font-size: 4.2rem;
	font-weight: 900;
	line-height: 1em;
}
#bkg .monthly-calendar .table-box{
}
#bkg .monthly-calendar .table{
	width: 100%;
	max-width: 100%;
	margin: 0 0 6rem;
	padding: 0;
	background-color: #f5f2e9;
}
#bkg .monthly-calendar .table:first-child{
	margin-top: 0;
}
#bkg .monthly-calendar .table ul.month{
	display: table;
	width: 100%;
	border-top: 1px solid #b3b3b3;
	border-left: 1px solid #b3b3b3;
	border-collapse: separate;
	vertical-align: middle;
	table-layout: fixed;
}
#bkg .monthly-calendar .table ul.month li.box.plan{
	width: 7em;
}
#bkg .monthly-calendar .table ul.month li.left_blank{
	display: none;
}
#bkg .monthly-calendar .table ul.month li.box{
	display: table-cell;
	vertical-align: top;
}
#bkg .monthly-calendar .table .box .week-day{
	display:         flex;
	display: -webkit-flex;
	-webkit-justify-content: center;
	        justify-content: center;
	        flex-flow: column wrap;
	-webkit-flex-flow: column wrap;
	        align-items: center;
	-webkit-align-items: center;
	height: 7.1rem;
	border-right: 1px solid #b3b3b3;
	border-bottom: 1px solid #b3b3b3;
	background-color: #f5f2e9;
}
#bkg .monthly-calendar .table .box .week-day .week{
	font-size: 1.4rem;
	font-weight: 500;
	line-height: 1em;
	padding: 0.7rem 0 0.4rem;
}
#bkg .monthly-calendar .table .box .week-day .day{
	font-size: 1.4rem;
	font-weight: 500;
	line-height: 1em;
	padding: 0;
}

#bkg .monthly-calendar .table .box.plan .week-day{
	font-weight: 500;
	line-height: 1em;
	color: #fff;
	background-color: #0076a9;
}
#bkg .monthly-calendar .table .box.plan .time{
	font-size: 1.4rem;
	line-height: 1em;
	display:         flex;
	display: -webkit-flex;
	-webkit-justify-content: center;
	        justify-content: center;
	        align-items: center;
	-webkit-align-items: center;
	height: 3.4rem;
	padding: 0.1rem;
	cursor: default;
	text-align: center;
	color: #fff;
	border-right: 1px solid #b3b3b3;
	border-bottom: 1px solid #b3b3b3;
	background-color: #0076a9;
}
#bkg .monthly-calendar .table .box .mark{
	height: 3.4rem;
	line-height: 3rem;
	padding: 0.1rem;
	cursor: default;
	text-align: center;
	border-right: 1px solid #b3b3b3;
	border-bottom: 1px solid #b3b3b3;
	background-color: #fff;
}
#bkg .monthly-calendar .table .box .mark a{
	font-size: 1.4rem;
	font-weight: 500;
	line-height: 1em;
	display:         flex;
	display: -webkit-flex;
	-webkit-justify-content: center;
	        justify-content: center;
	        align-items: center;
	-webkit-align-items: center;
	width: 100%;
	height: 100%;
	cursor: pointer;
	text-decoration: none;
}
#bkg .monthly-calendar .table .box .mark a:hover{
	color: #fff;
	background-color: rgba(0,118,169,0.5);
}
@media print, screen and (max-width: 1000px) and (min-width: 751px),(max-device-width: 1024px) and (min-device-width: 768px){
	#bkg .monthly-calendar .table-box{
		position: relative;
		z-index: 1;
		-webkit-overflow-scrolling: touch;
	}
	#bkg .monthly-calendar .table {
		margin: 0;
		overflow-x: scroll;
		overflow-y: hidden;
		white-space: nowrap;
	}
	#bkg .monthly-calendar .table ul.month li.box.plan{
		width: 100px;
	}
	#bkg .monthly-calendar .table ul.month li.left_blank{
		display: none;
	}
	#bkg .monthly-calendar .table ul.month li.box{
		width: 3.4rem;
	}

	#bkg .monthly-calendar .table .box.plan.box_left{
		position: sticky;
		position: -webkit-sticky;
		left: 0;
		top: 0;
		display: table-cell;
		-webkit-overflow-scrolling:auto;
		z-index: 1;
	}
	#bkg .monthly-calendar .table .box.plan.box_right{
		display:none;
	}
	#bkg .monthly-calendar .table .box .mark{
		width: 3.4rem;
		height: 3.4rem;
	}
}
@media only screen and (max-width: 750px) {
	#bkg .monthly-calendar{
		margin-bottom: 0.6rem;
	}
	#bkg .monthly-calendar .caption{
		width: 2rem;
		margin: 0 auto 0.32rem;
	}
	#bkg .monthly-calendar .caption .date_y{
		font-size: 0.42rem;
		margin-bottom: 0.08rem;
	}
	#bkg .monthly-calendar .caption .date_m{
		font-size: 0.74rem;
	}
	#bkg .monthly-calendar .table-box{
		position: relative;
		z-index: 1;
		-webkit-overflow-scrolling: touch;
	}
	#bkg .monthly-calendar .table {
		margin: 0;
		overflow-x: scroll;
		overflow-y: hidden;
		white-space: nowrap;
	}
	#bkg .monthly-calendar .table ul.month{
		border-top: none;
	}
	#bkg .monthly-calendar .table ul.month li.box.plan{
		width: 1.4rem;
	}
	#bkg .monthly-calendar .table ul.month li.left_blank{
		width: 1.4rem;
		display: none;
	}
	#bkg .monthly-calendar .table ul.month li.box{
		width: 2.3em;
	}
	#bkg .monthly-calendar .table .box .week-day{
		height: 1rem;
		border-top: 1px solid #b3b3b3;
	}
	#bkg .monthly-calendar .table .box .week-day .week{
		font-size: 0.26rem;
		padding: 0.1rem 0 0.05rem;
	}
	#bkg .monthly-calendar .table .box .week-day .day{
		font-size: 0.26rem;
	}
	#bkg .monthly-calendar .table .box.plan.box_left{
		position: sticky;
		position: -webkit-sticky;
		left: 0;
		top: 0;
		display: table-cell;
		-webkit-overflow-scrolling:auto;
		z-index: 1;
	}
	#bkg .monthly-calendar .table .box.plan.box_right{
		display: none;
	}
	#bkg .monthly-calendar .table .box.plan .week-day{
	}
	#bkg .monthly-calendar .table .box.plan .time{
		font-size: 0.26rem;
		width: 1.4rem;
		height: 0.6rem;
		padding: 0.1rem 0.15rem 0.12rem;
		white-space: nowrap;
	}
	#bkg .monthly-calendar .table .box .mark{
		height: 0.6rem;
		line-height: 0.35rem;
		padding: 0.1rem 0.16rem 0.12rem;
	}
	#bkg .monthly-calendar .table .box .mark a{
		font-size: 0.26rem;
	}
}


/* =========================================================
caution
========================================================= */
#caution{
	position: relative;
	z-index: 1;
	display:         flex;
	display: -webkit-flex;
	-webkit-justify-content: flex-start;
	        justify-content: flex-start;
	        flex-flow: row wrap;
	-webkit-flex-flow: row wrap;
	        align-items: stretch;
	-webkit-align-items: stretch;
	width: 100%;
	border-top: 1px solid #0076a9;
	border-bottom: 1px solid #0076a9;
	padding: 2.9rem 2rem 2.5rem 1.9rem;
	gap:2rem;
}
#caution h4{
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1em;
	text-align: left;
	letter-spacing: 0.02em;
	color: #0076a9;
	width: 22rem;
	padding: 0;
}
#caution p{
	line-height: 1.7em;
	text-align: left;
	letter-spacing: 0;
	color: #0076a9;
	width: calc(100% - 24rem);
	padding: 0;
}
@media only screen and (max-width: 750px){
	#caution{
		width: 100%;
		border-top: 1px solid #0076a9;
		border-bottom: 1px solid #0076a9;
		padding: 0.29rem 0 0.25rem;
		gap:0.6rem 0;
	}
	#caution h4{
		font-size: 0.26rem;
		width: 100%;
	}
	#caution p{
		margin-top: -0.4rem;
		line-height: 1.4em;
		width: 100%;
	}
}