@charset "utf-8";

@media screen and (min-width: 769px) {

	/*-----------------------------------
main
----------------------------------*/
	main .maininner {
		margin: 0 auto;
		max-width: 1200px;
		width: 95%;
		position: relative;
		padding: 100px 0;
	}

	main .maintitle {
		background: rgba(255, 255, 255, 0.4);
		border-left: 10px solid #299acc;
		padding: 15px 0 15px 30px;
		width: fit-content;
		position: absolute;
		top: 50%;
		left: 0;
		transform: translate(0, -50%);
	}

	main .maintitle h1 {
		color: #299acc;
		font-size: 36px;
		font-weight: bold;
		margin: 0 0 10px;
	}

	main .maintitle span {
		font-size: 18px;
	}

	main .main_list {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 2% 1%;
		max-width: 1200px;
		width: 100%;
		margin: 0 auto;
	}

	main .main_list li {
		margin: 0 0 1%;
		width: 15%;
		position: relative;
	}

	main .main_list li a {
		display: block;
		background: #fff;
		border: 1px solid #006cb9;
		font-size: 16px;
		text-align: center;
		margin: 0;
		padding: 8px 0 14px;
		width: 100%;
		transition: all ease 0.8s;
	}

	main .main_list li a:hover {
		background: #2ea7e0;
	}

	main .main_list li:after {
		content: "";
		background: url(/images/i_anchor.svg);
		background-repeat: no-repeat;
		background-size: 100%;
		width: 8px;
		height: 5px;
		position: absolute;
		bottom: 3px;
		left: 50%;
		transform: translate(-50%, 0);
	}

	/*-----------------------------------
contents
----------------------------------*/
	.contents_inner {
		margin: -120px auto 0;
		padding: 120px 0 0;
		max-width: 1200px;
		width: 95%;
	}

	.contents_inner_flex {
		display: flex;
		flex-wrap: wrap;
	}

	.contents_wrap {
		box-shadow: 5px 5px 10px 0 #ccc;
		border-top: 8px solid #006cb9;
		background: #fff;
		margin: 0 auto 40px;
		padding: 30px 60px;
		width: 100%;
	}

	.contents_inner_flex .contents_wrap {
		margin: 0 auto 3%;
		padding: 30px 30px;
		width: 48%;
	}

	.contents_wrap .top,
	.contents_wrap .sub {
		display: flex;
		flex-wrap: wrap;
		width: 100%;
	}

	.contents_wrap .sub {
		border-top: 1px solid #ccc;
		line-height: 1.4em;
		margin: 30px 0 0;
		padding: 30px 0 0;
	}

	.contents_wrap .contents_wrap_l {
		margin: 0 2% 0 0;
		width: 44%;
	}

	.contents_wrap .contents_wrap_r {
		width: 54%;
	}

	.contents_wrap .contents_wrap_f {
		width: 100%;
	}

	.contents_wrap .contents_wrap_top {
		margin: 0 0 40px;
		width: 100%;
	}

	.contents_wrap h2 {
		border-bottom: 4px solid #006cb9;
		color: #006cb9;
		font-size: 20px;
		font-weight: bold;
		margin: 20px 0 40px;
		padding: 0 0 10px 100px;
	}

	.contents_wrap .contents_wrap_f h2 {
		width: 100%;
	}

	.contents_wrap .sub_none h2 {
		padding: 0 0 10px 20px;
	}

	.contents_wrap .sub_none h2:before {
		display: none;
	}

	.contents_wrap .bt_none {
		border-top: unset;
		margin: 0 0 0;
		padding: 0 0 0;
	}

	.contents_wrap .l-list {
		margin: 0 0 20px;
	}

	.contents_wrap .l-list dl {
		margin: 0 0 20px;
	}

	.contents_wrap .l-list dl dt {
		background: #006cb9;
		color: #fff;
		font-weight: normal;
		margin: 0 0 10px;
		padding: 5px 0 5px 20px;
	}

	.contents_wrap .l-list dl dd {
		padding: 5px 0 5px 20px;
	}

	.contents_wrap .photobox {
		margin: 3% auto;
		width: 60%;
	}

	.contents_wrap .singlebox {
		display: flex;
		flex-wrap: wrap;
	}

	.contents_wrap .singlebox li {
		margin: 0 1% 2%;
		width: 45%;
	}

	.contents_wrap .imgbox,
	.contents_wrap .imgbox_dual {
		text-align: center;
		display: flex;
		flex-wrap: wrap;
		margin: 2% 0 0;
		width: 100%;
	}

	.contents_wrap .imgbox_dual {
		margin: 2% auto 0;
		width: 70%;
	}

	.contents_wrap .imgbox li {
		margin: 0 1% 2%;
		width: 23%;
	}

	.contents_wrap .imgbox_dual li {
		margin: 0 1% 2%;
		width: 48%;
	}

	.contents_wrap .imgbox li span,
	.contents_wrap .imgbox_dual li span {
		display: block;
		padding: 5px 0;
	}

	.contents_wrap .bfbox {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin: 5% 0;
	}

	.contents_wrap .bfbox li {
		width: 48%;
	}

	.contents_wrap .bfbox_w li {
		width: 24%;
	}

	.contents_wrap .bfbox li span {
		display: block;
		text-align: center;
		padding: 0 0 10px;
	}

	.contents_wrap .bfbox li.before {
		position: relative;
	}

	.contents_wrap .bfbox li.before:after {
		content: "";
		background: url(/images/arrow02.png);
		background-repeat: no-repeat;
		background-size: 100%;
		width: 32px;
		height: 32px;
		position: absolute;
		top: 54%;
		right: -10%;
		transform: translate(0, -50%);
		z-index: 1;
	}

	.contents_wrap .caption {
		font-size: 16px;
		margin: 0 0 40px;
	}

	.contents_wrap .r-list {
		margin: 0 0 20px;
	}

	.contents_wrap .r-list dl {
		display: flex;
		flex-wrap: wrap;
		color: #006cb9;
	}

	.contents_wrap .r-list dl dt {
		background: #dfecf4;
		border-top: 3px solid #006cb9;
		border-right: 3px solid #006cb9;
		border-bottom: 3px solid #006cb9;
		padding: 10px 20px;
		width: 60%;
	}

	.contents_wrap .r-list dl dd {
		background: #fff;
		border-right: 3px solid #006cb9;
		border-bottom: 3px solid #006cb9;
		padding: 10px 20px;
		width: 60%;
	}

	.contents_wrap .r-list dl dt:nth-child(1),
	.contents_wrap .r-list dl dd:nth-child(1) {
		border-left: 3px solid #006cb9;
		width: 40%;
	}

	.contents_wrap .r-list.triple dl dt,
	.contents_wrap .r-list.triple dl dd {
		width: 33%;
	}

	.contents_wrap .r-list.quatre dl dt,
	.contents_wrap .r-list.quatre dl dd {
		width: 25%;
	}

	.contents_wrap .contents_wrap_f {
		display: flex;
		flex-wrap: wrap;
		gap: 4%;
	}

	.contents_wrap .contents_wrap_f .bfbox {
		margin: 0 0 2%;
		width: 48%;
	}

	.contents_wrap .contents_wrap_f .bfbox_w {
		margin: 0 0 2%;
		width: 100%;
	}

	.contents_wrap .contents_wrap_f .bfbox_center {
		margin: 0 auto 2%;
	}

	.contents_wrap .contents_wrap_top dl {
		margin: 0 0 20px;
		width: 44%;
	}

	.contents_wrap .contents_wrap_top dl dt {
		background: #006cb9;
		color: #fff;
		font-weight: normal;
		margin: 0 0 10px;
		padding: 5px 0 5px 20px;
	}

	.contents_wrap .contents_wrap_top figure {
		margin: 0 0 20px;
	}

	.contents_wrap .addtext {
		font-size: 0.8em;
	}

	.contents_wrap .catchbox {
		width: 100%;
		position: relative;
	}

	.contents_wrap .catchbox dt {
		background: #ffe200;
		margin: 20px 0 20px;
		padding: 5px 0 5px 20px;
	}
}

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

	/*-----------------------------------
main
----------------------------------*/
	main .maininner {
		margin: 0 auto;
		width: 95%;
		position: relative;
		padding: 32% 0;
	}

	main .maintitle {
		background: rgba(255, 255, 255, 0.4);
		border-left: 8px solid #299acc;
		padding: 15px 0 15px 15px;
		width: fit-content;
		position: absolute;
		top: 30%;
		left: 0;
	}

	main .maintitle h1 {
		color: #299acc;
		font-size: 28px;
		font-weight: bold;
		margin: 0 0 10px;
	}

	main .maintitle span {
		font-size: 14px;
	}

	main .maininner .main_list {
		display: none;
	}

	main .main_list {
		display: flex;
		flex-wrap: wrap;
		gap: 2% 1%;
		margin: 0 auto;
		width: 95%;
	}

	main .main_list li {
		margin: 0 0 1%;
		width: 32%;
		position: relative;
	}

	main .main_list li a {
		display: block;
		background: #fff;
		border: 1px solid #006cb9;
		font-size: 0.8em;
		text-align: center;
		margin: 0;
		padding: 12px 0 15px;
		width: 100%;
		transition: all ease 0.8s;
	}

	main .main_list li a:hover {
		background: #2ea7e0;
	}

	main .main_list li:after {
		content: "";
		background: url(/images/i_anchor.svg);
		background-repeat: no-repeat;
		background-size: 100%;
		width: 8px;
		height: 5px;
		position: absolute;
		bottom: 3px;
		left: 50%;
		transform: translate(-50%, 0);
	}

	/*-----------------------------------
contents
----------------------------------*/
	.contents_inner {
		margin: -120px auto 0;
		padding: 120px 0 0;
		width: 95%;
	}

	.contents_wrap {
		box-shadow: 5px 5px 10px 0 #ccc;
		border-top: 8px solid #006cb9;
		background: #fff;
		margin: 0 auto 40px;
		padding: 30px 30px;
		width: 100%;
	}

	.contents_wrap .top,
	.contents_wrap .sub {
		display: flex;
		flex-wrap: wrap;
		width: 100%;
	}

	.contents_wrap .sub {
		border-top: 1px solid #ccc;
		line-height: 1.4em;
		margin: 4% 0 0;
		padding: 4% 0 0;
	}

	.contents_wrap .contents_wrap_l {
		margin: 0 0 4% 0;
		width: 100%;
	}

	.contents_wrap .contents_wrap_r {
		margin: 0 0 4% 0;
		width: 100%;
		position: relative;
	}

	.contents_wrap .contents_wrap_f {
		margin: 0 0 4% 0;
		width: 100%;
	}

	.contents_wrap .contents_wrap_top {
		margin: 0 0 4%;
		width: 100%;
	}

	.contents_wrap h2 {
		border-bottom: 4px solid #006cb9;
		color: #006cb9;
		font-size: 20px;
		font-weight: bold;
		margin: 20px 0 40px;
		padding: 0 0 10px 80px;
	}

	.contents_wrap .contents_wrap_f h2 {
		width: 100%;
	}

	.contents_wrap .sub_none h2 {
		padding: 0 0 10px 20px;
	}

	.contents_wrap .sub_none h2:before {
		display: none;
	}

	.contents_wrap .bt_none {
		border-top: unset;
		margin: 0 0 0;
		padding: 0 0 0;
	}

	.contents_wrap .l-list {
		margin: 0 0 20px;
	}

	.contents_wrap .l-list dl {
		margin: 0 0 20px;
	}

	.contents_wrap .l-list dl dt {
		background: #006cb9;
		color: #fff;
		font-weight: normal;
		margin: 0 0 10px;
		padding: 5px 0 5px 20px;
	}

	.contents_wrap .l-list dl dd {
		padding: 5px 0 5px 20px;
	}

	.contents_wrap .blankbox {
		display: none;
	}

	.contents_wrap .photobox {
		margin: 3% auto;
		width: 60%;
	}

	.contents_wrap .singlebox {
		display: flex;
		flex-wrap: wrap;
	}

	.contents_wrap .singlebox li {
		margin: 0 auto 2%;
		width: 60%;
	}

	.contents_wrap .imgbox,
	.contents_wrap .imgbox_dual {
		text-align: center;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin: 2% 0 0;
	}

	.contents_wrap .imgbox li,
	.contents_wrap .imgbox_dual li {
		margin: 0 1% 2%;
		width: 48%;
	}

	.contents_wrap .imgbox li span,
	.contents_wrap .imgbox_dual li span {
		display: block;
		padding: 5px 0;
	}

	.contents_wrap .bfbox {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin: 5% 0;
	}

	.contents_wrap .bfbox li {
		width: 48%;
	}

	.contents_wrap .bfbox li span {
		display: block;
		text-align: center;
		padding: 0 0 10px;
	}

	.contents_wrap .bfbox li.before {
		position: relative;
	}

	.contents_wrap .bfbox li.before:after {
		content: "";
		background: url(/images/arrow02.png);
		background-repeat: no-repeat;
		background-size: 100%;
		width: 32px;
		height: 32px;
		position: absolute;
		top: 54%;
		right: -10%;
		transform: translate(0, -50%);
	}

	.contents_wrap .caption {
		font-size: 16px;
		margin: 0 0 40px;
	}

	.contents_wrap .r-list {
		margin: 0 0 20px;
	}

	.contents_wrap .r-list dl {
		display: flex;
		flex-wrap: wrap;
		color: #006cb9;
	}

	.contents_wrap .r-list dl dt {
		background: #dfecf4;
		border-top: 3px solid #006cb9;
		border-right: 3px solid #006cb9;
		border-bottom: 3px solid #006cb9;
		padding: 10px 20px;
		width: 60%;
	}

	.contents_wrap .r-list dl dd {
		background: #fff;
		border-right: 3px solid #006cb9;
		border-bottom: 3px solid #006cb9;
		padding: 10px 20px;
		width: 60%;
	}

	.contents_wrap .r-list dl dt:nth-child(1),
	.contents_wrap .r-list dl dd:nth-child(1) {
		border-left: 3px solid #006cb9;
		width: 40%;
	}

	.contents_wrap .r-list.triple dl dt,
	.contents_wrap .r-list.triple dl dd {
		width: 33%;
	}

	.contents_wrap .r-list.quatre dl dt,
	.contents_wrap .r-list.quatre dl dd {
		width: 25%;
	}

	.contents_wrap .contents_wrap_f {
		display: flex;
		flex-wrap: wrap;
		gap: 4%;
	}

	.contents_wrap .contents_wrap_f .bfbox {
		margin: 0 auto 2%;
		width: 100%;
	}

	.contents_wrap .contents_wrap_top dl {
		margin: 0 0 20px;
		width: 44%;
	}

	.contents_wrap .contents_wrap_top dl dt {
		background: #006cb9;
		color: #fff;
		font-weight: normal;
		margin: 0 0 10px;
		padding: 5px 0 5px 20px;
	}

	.contents_wrap .contents_wrap_top figure {
		margin: 0 0 20px;
	}

	.contents_wrap .addtext {
		font-size: 0.8em;
	}

	.contents_wrap .catchbox {
		width: 100%;
		position: relative;
	}

	.contents_wrap .catchbox dt {
		background: #ffe200;
		margin: 20px 0 20px;
		padding: 5px 0 5px 20px;
	}
}