@charset "utf-8";

@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css");
@import url('https://fonts.googleapis.com/css2?family=Murecho:wght@100..900&display=swap');
@import url("https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css");
@import url("slide.css");
@import url("inview.css");
:root {
	--primary-color: #19447e;
	--primary-inverse-color: #fff;
	--step_color_complete: #325A90;
	--step_color: #A5BDDE;
	--step_color_no_completion :#A5BDDE;
	--global-space: 4vw;
}
@keyframes animation1 {
	0% {right: -100vw;}
	100% {right: 0px;}
}
@keyframes opa1 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@keyframes fadeIn {
	0% {opacity: 0;transform: scale(0.1) rotate(-30deg);}
	100% {opacity: 1;transform: scale(1) rotate(0deg);}
}
@keyframes spin {
	0% {transform: rotate(0deg);}
	100% {transform: rotate(360deg);}
}
body * {box-sizing: border-box;}
html,body {font-size: 14px;}
body {
	margin: 0;padding:0;
	font-optical-sizing: auto;
	-webkit-text-size-adjust: none;
	background: #fff;
	color: #333;
	line-height: 2;
	overflow-x: hidden;
}
figure {margin: 0;}
dd {margin: 0;}
nav ul {list-style: none;}
nav,ul,li,ol {margin: 0;padding: 0;}
section li {margin-left: 1rem;}
table {border-collapse:collapse;}
img {border: none;max-width: 100%;height: auto;vertical-align: middle;}
video {max-width: 100%;}
iframe {width: 100%;}
input {font-size: 1rem;}
section + section {margin-top: var(--global-space);}
a {
	color: inherit;
	transition: 0.3s;
}
a:hover {
	text-decoration: none;
	opacity: 0.9;
}
#container {
	height: 100vh;
	display: flex;
	flex-direction: column;
}
#contents {
	flex: 1;
	padding: 0 var(--global-space);
	margin-top:60px;
}

header {	
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 60px;
	padding: 0 var(--global-space);
	font-optical-sizing: auto;
	font-weight: 700;
	background: var(--primary-color);
	color: var(--primary-inverse-color);
	position: fixed;
	width: 100%;
	z-index: 100;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
header a {color: inherit;}
.logo a {display: block;text-decoration: none;}
.logo img {display: block;}
.logo {
	margin: 0;padding: 0;
	width: 200px;
	font-size: 1.5rem;
	font-weight: 500;
	letter-spacing: 0.1em;
}
form{
	max-width:1280px;
	margin:auto;
}
form input[type="text"],
form input[type="email"],
form input[type="tel"],
form textarea{
	width:100%;
	padding:8px;
}
form .radio_box_1{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
}
form .radio_box_2{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
}
form .radio_box_2:last-of-type{
	margin-bottom:32px;
}
form .radio_box_2 p{
	width:240px;
}
form .radio_box_2 p input[type="radio"]{
	width:16px;
	margin:0;
  top:1px;
  position: relative;
}
form p{
	margin:16px 0 32px;
}
form button{
	display: block;
	width:320px;
	height:4em;
	margin:auto;
	line-height:2em;
	font-size: 1rem;
	font-weight: bold;
}
form .button_base{
	background: var(--primary-color);
	color: var(--primary-inverse-color);
}
form .button_base:hover{
	background: #2161B2;
}
.form_table{
	max-width:1280px;
	margin:auto;
}
.form_btn{
	display: flex;
	justify-content: center;
}
.form_btn p{
	width:320px;
	margin:32px;
}
.thank_you{
	max-width:1000px;
	margin:auto;
}
.error_txt{
	font-size:1.2em;
	color:#D8000C;
}
.required{
	margin:0 4px 0 0;
	padding: 2px 6px;
	font-size: 12px;
	font-weight: bold;
	color:#fff;
	background:#f0ad4e;
	border-radius: 8px;
}
header nav ul {display: none;}
header nav ul ul,
.small-screen #menubar ul ul {animation: opa1 0.5s 0.1s both;}
header nav ul ul {position: absolute;z-index: 100;}
header nav ul ul a {
	background: var(--primary-inverse-color);
	color: var(--primary-color);
	padding: 0.3em 1em;
	margin-top: 4px;
	border: 1px solid var(--primary-color);
}
#menubar {display: none;}
#menubar ul {list-style: none;margin: 0;padding: 0;}
#menubar a {display: block;text-decoration: none;}
.large-screen #menubar {display: block;}
.small-screen #menubar.display-block {display: block;}
#menubar_hdr.display-none {display: none;}
.ddmenu_parent ul {display: none;}
a.ddmenu::before {
	font-family: "Font Awesome 6 Free";
	content: "\f078";
	font-weight: bold;
	margin-right: 0.5em;
}
.small-screen #menubar.display-block {
	position: fixed;overflow: auto;z-index: 100;
	right: 0px;top: 0px;
	width: 100%;
	height: 100%;
	padding: 90px 10vw 50px;
	background: var(--primary-color);
	color: var(--primary-inverse-color);
	animation: animation1 0.2s both;
}
.small-screen #menubar ul ul {margin: 2rem;}
.small-screen #menubar nav ul li {
	border: 1px solid var(--primary-inverse-color);
	margin: 1rem 0;
	border-radius: 5px;
}
.small-screen #menubar a {
	color: inherit;
	padding: 1rem 2rem;
}
.small-screen #menubar a:hover {
	color: var(--primary-color);
	background: var(--primary-inverse-color);
}
#menubar_hdr {
	animation: opa1 0.3s 0.5s both;
	position: fixed;z-index: 101;
	cursor: pointer;
	top: 5px;
	right: 10px;
	width: 50px;
	height: 50px;
	padding: 15px;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: transform 0.5s;
	background: var(--primary-color);
	border-radius: 50%;
}
#menubar_hdr:hover {transform: scale(1.2);}
#menubar_hdr.ham {
	width: 80px;
	height: 80px;
}
#menubar_hdr div {
	position: relative;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
#menubar_hdr div span {
	display: block;
	width: 100%;
	height: 2px;
	background-color: var(--primary-inverse-color);
	border-radius: 2px;
	transition: all 0.5s ease-in-out;
	position: absolute;
}
#menubar_hdr div span:nth-child(1) {top: 0;}
#menubar_hdr div span:nth-child(2) {top: 50%;transform: translateY(-50%);}
#menubar_hdr div span:nth-child(3) {bottom: 0;}
#menubar_hdr.ham div span:nth-child(1) {top: 50%;transform: translateY(-50%) rotate(45deg);}
#menubar_hdr.ham div span:nth-child(2) {opacity: 0;}
#menubar_hdr.ham div span:nth-child(3) {top: 50%;transform: translateY(-50%) rotate(-45deg);}
main {
	max-width:1280px;
	margin: auto;
	padding: 0 0 4vh;
}
main.top_main{
	max-width:100%;
	margin:0 0 var(--global-space);;
	padding: 4vh 0;
}
main h2 {
	color: var(--primary-color);
	font-size: 1.8rem;
	font-weight: 500;
}
main .bg1 h2 {
	color: var(--primary-inverse-color);
	border-color: var(--primary-inverse-color);
}
h2.box1 {
	font-size: 2.4rem;
	letter-spacing: 0.3em;
}
main h2 .small {
	display: block;
	font-weight: normal;
	font-size: 0.8rem;
	letter-spacing: 0.1em;
}
main h3 {font-weight: 500;}
main .box1 {
	border: 1px solid var(--primary-color);
	padding: 4vw;
	margin-bottom: var(--global-space);
}
.box1 .list-free:last-of-type {margin-bottom: 0;}
main .style1 {
	position: relative;
	font-weight: normal;
	margin-bottom: 2rem;
}
header .tel{
	justify-content: flex-end;
}
footer {
	font-size: 0.8rem;
	border-top: 3px solid var(--primary-color);
	padding: 6vw 6vw 2vw var(--global-space);
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 3vw;
	color: var(--primary-color);
	background: url("../img/logo_kazari.svg") no-repeat right bottom / 20%;
}
footer a {
	text-decoration: none;
	color: inherit;
}
footer nav {
	display: flex;
	flex-wrap: wrap;
	font-weight: bold;
}
footer nav ul {
	flex: 1;
	width:128px;
}
footer nav ul li{
	margin:8px 0;
	line-height: 1.4;
}
footer nav a {font-weight: normal;}
footer .pr {display: block;}
#copyright {
	width: 100%;
	text-align: center;
}
ul.icons {
	list-style: none;
	margin: 0;padding: 0;
	display: flex;
	gap: 1rem;
}
.icons i {font-size: 30px;}
.fade-in-text {visibility: hidden;}
.char {
    display: inline-block;
    opacity: 0;
    animation: fadeIn 0.2s linear both;
}
.list-grid1 .list * {margin: 0;padding: 0;}
.list-grid1 .list {
  display: grid;
	margin-bottom: var(--global-space);
}
.list-grid1 .list p {
	font-size: 0.85rem;
	line-height: 1.5;
}
.list-grid1 .list {
	padding: 1rem;
	background: #fff;
	color: #111;
  grid-template-rows: auto 1fr auto;
	box-shadow: 5px 5px 20px rgba(0,0,0,0.1);
}
.list-grid1 .list figure {
	margin: -1rem;
	margin-bottom: 0.5rem;
}
.flex_img{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
}
.flex_img div{margin: 32px 0;}
.flex_img img{
	width:100%;
	height: 100%;
	max-width:320px;
	max-height: 240px;
	box-shadow: 0px 10px 10px rgba(0,0,0,0.1);
	margin-bottom: 1rem;	
}
.flex_img h4{margin: 0;}
.flex_img ul{
	margin: 0 0 0 4px;
	padding: 0;
}
.list-free {
	display: flex;
  flex-direction: column;
	margin-bottom: 10vw;
	gap: 5vw;
}
.bg1 .list-free:last-of-type,
.bg2 .list-free:last-of-type {margin-bottom: 0;}
.list-free .text {align-self: flex-start;flex: 1;}

.list-free h3 {
	margin-top: 0;
	letter-spacing: 0.1em;
	font-size: 1.5rem;
	color: var(--primary-color);
	position: relative;
}
.free h3 {
	margin-top: 0;
	letter-spacing: 0.1em;
	font-size: 1.5rem;
	color: var(--primary-color);
	position: relative;
}
.bg1 .list-free h3 {color: var(--primary-inverse-color);}
.list-free .vertical-text {margin: auto;}
.list-free .vertical-text::before,
.list-free .vertical-text::after {
	content: "";
	position: absolute;
	width: 20px;
	height: 50px;
	border: 1px solid var(--primary-color);
}
.bg1 .list-free .vertical-text::before,
.bg1 .list-free .vertical-text::after {
	border-color: var(--primary-inverse-color);
}
.list-free .vertical-text::before {
	top: -15px;
	left: -15px;
	border-right: none;
	border-bottom: none;
}
.list-free .vertical-text::after {
	bottom: -15px;
	right: -15px;
	border-left: none;
	border-top: none;
}
.list-free .image {
	position: relative;
}
.list-free .image img {
	box-shadow: 0px 10px 40px rgba(0,0,0,0.1);
	margin-bottom: 1rem;
}
.iframe-box {
	width: 100%;
	height: 0;
	padding-top: 56.25%;
	position: relative;
}
.iframe-box iframe {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
}
.list-free .image > div {
	font-size: 0.7rem;
	padding: 1rem 2rem;
}
.btn1 a, .btn2 a {
	display: block;text-decoration: none;
	font-size: 1rem;
	margin-top: 1rem !important;
}
.btn1 a {
	text-align: center;
	background: var(--primary-color);
	color: var(--primary-inverse-color);
	padding: 0.5rem !important;
}
.btn2 {text-align: right;}
.btn2 a {
	display: inline-block;
	color: var(--primary-color);
	position: relative;
	padding-right: 80px;
}
.btn2 a::after {
	content: "";
	background: #fff url("../images/arrow1.svg") no-repeat right center / 120px;
	display: block;
	position: absolute;
	right: 0px;
	bottom: -1em;
	width: 60px;
	height: 60px;
	border: 1px solid var(--primary-color);
	border-radius: 50%;
	text-align: center;
	transition: 0.3s;
}
.btn2 a:hover::after {background: var(--primary-color) url("../images/arrow1.svg") no-repeat left center / 120px;}
.new {
	flex: 1;
	border-top: 1px solid #ccc;
}
.new dt {padding: 1rem 0;}
.new dd {
	padding: 0 1rem 1rem;
	border-bottom: 1px solid #ccc;
}
.new dt span {
	display: inline-block;
	margin-right: -1rem;
	text-align: center;
	line-height: 1.8;
	border-radius: 3px;
	padding: 0 0.5rem;
	width: 8rem;
	transform: scale(0.8);
	background: #fff;
	color:#777;
	border: 1px solid #999;
}
.new .icon-bg1 {
	background: var(--primary-color);
	color: var(--primary-inverse-color);
	border-color: transparent;
}
.bg1 .new .icon-bg1 {
	background: var(--primary-inverse-color);
	color: var(--primary-color);
}
.thumbnail-view {
	max-width: 1000px;
	margin: 0 auto 4rem;
	text-align: center;
}
.thumbnail-view + .thumbnail{margin:-3rem auto 4rem;}
.thumbnail {
	display: flex;
	justify-content: center;
	margin-bottom: 2rem;
}
.thumbnail img {
	width: 100px;
	margin: 2px;
	cursor: pointer;
	transition: 0.3s;
}
.thumbnail img:hover {
	opacity: 0.8;
}
.ta1 caption {
	font-weight: bold;
	padding: 0.5rem 1rem;
	background: #999;
	color: #fff;
	margin-bottom: 1rem;
	border-radius: 5px;
}
.ta1 {
	table-layout: fixed;
	border-top: 1px solid #ccc;
	width: 100%;
	margin-bottom: 5rem;
}
.ta1 th, .ta1 td {
	padding: 1rem;
	word-break: break-all;
}
.ta1 th {border: 1px solid #9E9E9E;}
.ta1 td {border: 1px solid #ccc;}
.ta1 tr:nth-child(2n+1) {background: #f5f5f5;}
.ta1 th {
	width: 30%;
	text-align: left;
	background: #C4C4C4;
}
.bg1 {
	background: var(--primary-color);
	color: var(--primary-inverse-color);
	padding: var(--global-space);
  margin-right: calc(-1 * var(--global-space));
  margin-left: calc(-1 * var(--global-space));
}
.bg2 {
	background: #f0f0f0;
	color: var(--primary-color);
	padding: var(--global-space);
  margin-right: calc(-1 * var(--global-space));
  margin-left: calc(-1 * var(--global-space));
}
.marker {
	display: inline-block;
	background: linear-gradient(transparent 80%, yellow 80%);
}
h3.marker {font-size: 2rem;}
.clearfix::after {content: "";display: block;clear: both;}
.color-check, .color-check a {color: #ff0000 !important;}
.bg1 .color-check, .bg1 .color-check a {color: yellow !important;}
.bg1 .look .color-check, .bg1 .look .color-check a {color: #ff0000 !important;}
.l {text-align: left !important;}
.c {text-align: center !important;}
.r {text-align: right !important;}
.ws {width: 95%;display: block;}
.wl {width: 95%;display: block;}
.mb0 {margin-bottom: 0px !important;}
.mb30 {margin-bottom: 30px !important;}
.look {display: inline-block;padding: 0px 10px;background: #eee;color: #333;border: 1px solid #ccc; border-radius: 3px;margin: 5px 0; word-break: break-all;}
.bg1 .look,.bg2 .look {background: #fff;}
.small {font-size: 0.75em;}
.large {font-size: 2em; letter-spacing: 0.1em;}
.pc {display: none;}
.dn {display: none !important;}
.block {display: block !important;}
.flex_box {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}
ul.flex_box{
	justify-content: flex-start;
	margin:16px 24px;
}
ul.flex_box li{
	width:320px;
	margin:16px 8px;
	font-size: 18px;
}
.flex_box h4{width:100%;}
.tag p{
	width:240px;
	margin: 16px 42px;;
	border-radius: 32px;
	font-size: 16px;
	text-align: center;
	background: var(--primary-color);
	color: var(--primary-inverse-color);
}
.w1280{max-width:1280px;}
.w20vw {max-width:20vw;}
.w30vw {
	width:320px;
	max-width:25vw;
}
.m_auto{margin: auto;}
.mtb64_auto{margin:64px auto;}
.list-grid2 {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.list-grid2 div{
	width:320px;
	margin: 32px 2vw;
}
.h2_small{
	display: block;
	margin:16px;
	line-height: 1.2em;
	font-size:0.6em
}
.ta1.thcol2 th:first-of-type{
	width:72px;
	padding: 0 0 0 1em;
	border-style:solid none solid solid;
}
.ta1.thcol2 th:last-of-type{
	width:64px;
	padding: 0 1em 0 0;
	border-style:solid solid solid none;
	text-align: right;
}
.step_box{
	display: flex;
  justify-content: center;
	max-width:1280px;
	margin:16px auto 64px;
}
.step_box p{
	position: relative;
	width:20%;
	text-align: center;
	color: var(--step_color);
	font-weight: bold;
}
.step_box p.complete{
	color: var(--step_color_complete);
}
.step_box p.complete span{
	color:#fff;
	background: var(--step_color_complete);
}
.step_box p span{
	display: block;
	width:32px;
	height:32px;
	margin: auto;
	color:#fff;
	background: var(--step_color_no_completion);
	border-radius:50%;
}
.step_box p span:before{
	position: absolute;
	z-index: -1;
	top: 15px;
	left: -50%;
	width: 100%;
	height: 2px;
	content: '';
	background: var(--step_color_no_completion);
}
.step_box p:first-of-type span:before{
	display: none;
}
.step_box p.complete span:before{
	color:#fff;
	background: var(--primary-color);
}
.breadcrumb {
  font-size: 0.9em;
  margin: 1em 0;
}
.breadcrumb ol {
  list-style: none;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
}
.breadcrumb li + li::before {
  content: ">";
  margin: 0 0.5em;
  color: #666;
}
.breadcrumb a {
  color: #0073aa;
  text-decoration: none;
}
.breadcrumb a:hover {
  text-decoration: underline;
}
#menubar_hdr{display: none;}











p.contct_btn{
	width:480px;
	margin:auto;
}
p.contct_btn a{
  position: relative;
	display: block;
	height:80px;
	line-height: 72px;
  text-align: center;
  font-weight: bold;
	text-decoration:none;
  border: 2px solid var(--primary-color);
	color:var(--primary-color);
}
p.contct_btn a .arrow{
  position: absolute;
	top: 0;
  left: 0;
  display: block;
  width: 16px;
  height: 100%;
  content: '';
  -webkit-transition: all .3s;
  transition: all .3s;
  -webkit-transform: translateX(0) translateY(0);
  transform: translateX(0) translateY(0);
  border-radius: 0 50% 50% 0;
  background: var(--primary-color);
}
p.contct_btn a .arrow::before {transform: rotate(45deg);}
p.contct_btn a .arrow::after {transform: rotate(-45deg);}
p.contct_btn a .arrow::before,
p.contct_btn a .arrow::after {
  content: "";
  position: absolute;
  display: inline-block;
	top: 45%;
	left: 0;
  width: 16px;
  height: 3px;
  border-radius: 9999px;
	background: var(--primary-color);
  transform-origin: calc(100% - 1px) 50%;
}
p.contct_btn a:hover{
  background:var(--primary-color);
  color:#FFF;
}
p.contct_btn a:hover .arrow {
  position: absolute;
  top:6px;
  left: 49%;
  width: 48px;
  height: 48px;
  -webkit-transform: translateX(460%) translateY(.5rem);
  transform: translateX(460%) translateY(.5rem);
  border-radius: 50%;
	background:#fff;
	border:1px solid var(--primary-color);
}
p.contct_btn a:hover .arrow:before,
p.contct_btn a:hover .arrow:after{
  left:30%;
}


































@media screen and (max-width:1360px){
	.list-grid1 {
		display: grid;
		grid-template-columns: repeat(auto-fit, 28vw);
		gap: 3vw;
		justify-content: center;
	}
}
@media screen and (max-width:1280px){
	.list-grid2 div{
		max-width:25vw;
		margin:24px 2vw;
	}	
	.slideshow_top{height:45vw;}
	.tag p{margin: 16px 8px;}
	.list-free .image.order1 img {border-radius: 0px 30px 30px 0px;}
	.list-free .image.order3 img {border-radius: 30px 0px 0px 30px;}
}
@media screen and (max-width:1170px) {
		ul.flex_box li{
		width:256px;
		font-size: 16px;
	}
}
@media screen and (max-width:1140px) {
	form .radio_box_2 p{
		width: 200px;
	}
}
@media screen and (max-width:1000px){
	header > nav > ul {font-size: 14px;}
	ul.flex_box li{
		font-size: 16px;
	}
}
@media screen and (max-width:950px) {
	form .radio_box_2 p{
		width: 180px;
	}
}
@media screen and (max-width:900px) {
	#menubar_hdr{
		display: block;
	}
	form .radio_box_2 p{
		width: 160px;
	}
	form .radio_box_2 p input[type="radio"]{
		top: 2px;
	}
	.step_box p span{
		width:32px;
		height:32px;
		font-size: 16px;
	}
}
@media screen and (max-width:750px){
	.list-grid1 {
		display: block;
	}
}
@media screen and (max-width:700px){
	.w1280{margin: 0;}
	.tag p{
		width:192px;
		margin: 8px 0;;
		font-size: 14px;
	}
	p.contct_btn{
		width:90%;
		background: var(--primary-color);
	}
	p.contct_btn a{
		height:48px;
		line-height: 40px;
		color:#fff;
	}
	p.contct_btn a .arrow{
		left:auto;
		right: 32px;
		transform:none;
	}
	p.contct_btn a .arrow::before,
	p.contct_btn a .arrow::after{
		width: 12px;
		background:#fff;
	}
	p.contct_btn a:hover{
		background:var(--primary-color);
		color:#FFF;
	}
	p.contct_btn a:hover .arrow {
		top:-2px;
		left: auto;
		right: 0px;
		transform: none;
		border-radius:0;
		background:none;
		border:none;
	}
	p.contct_btn a:hover .arrow:before,
	p.contct_btn a:hover .arrow:after{
		left:0;
	}


	
}
@media screen and (max-width:600px){
	.list-free {
		gap: 1vw;
	}
	.flex_img{
		flex-wrap: wrap;
	}
	.flex_img .w20vw{
		max-width: 40vw;
	}
	.w30vw {
		max-width:100%;
	}
	ul.flex_box li{
		font-size: 14px;
		margin: 8px;
	}
	.list-free .image.order1 img {border-radius:0;}
	.list-free .image.order3 img {border-radius:0}
}
@media screen and (max-width:550px) {
	main h2.w1{
		margin:32px 0 0;
	}
	form .radio_box_2 p{
		width:160px;
	}
}
@media screen and (max-width:480px){
	.h2_small {
		margin: 8px 0;
		font-size: 0.38em;
	}
	.ta1.thcol2 th:first-of-type{
		width:64px;
		padding: 0 0 0 0.8em;
	}
	.ta1.thcol2 th:last-of-type{
		width:48px;
		padding: 0 0.8em 0 0;
		border-style:solid solid solid none;
		text-align: right;
	}
	.tag p{
		width: 160px;
		font-size: 12px;
	}
	.sm_mt120p{
		margin-top:80px
	}
}
@media screen and (min-width:900px) {
	html, body {font-size: 16px;}
	header {height: 120px;}
	header > nav > ul {
		display: flex;
		font-size: 16px;
	}
	header > nav > ul span {font-size: 14px;}
	header nav li a {
		display: block;text-decoration: none;
		padding: 0.5rem 1rem;
	}
	main .box1 {padding:2vw;}
	#contents {margin-top:120px;}
	#menubar_hdr {top: 34px;}
	.logo {width: 300px;}	
	.ta1 th {width: 20%;}
	.ws {width: 48%;display: inline;}
	.sh {display: none;}
	.pc {display: block;}
}
@media screen and (min-width:800px) {
	.list-grid1 {
		display: grid;
		grid-template-columns: repeat(auto-fit, 364px);
		gap: 3vw;
		justify-content: center;
	}
	.list-grid1 .list {margin-bottom: 0;}
}
@media screen and (min-width:600px) {
	.list-free {
		flex-direction: row;
		align-items: flex-start;
	}
	.list-free .vertical-text {
		writing-mode: vertical-rl;
		text-orientation: upright;
		padding: 1rem 0.5rem;
	}
	.list-free .image.order3 {margin-right: calc(-1 * var(--global-space));}
	.list-free .image.order3 img {border-radius: 30px;}
	.list-free .image.order1 {margin-left: calc(-1 * var(--global-space));}
	.list-free .image.order1 img {border-radius:30px;}
	.list-free .w1 {width: 30%;}
	.list-free .w2 {width: 50%;}
	.list-free .order1 {order: 1;}
	.list-free .order2 {order: 2;}
	.list-free .order3 {order: 3;}
	.list-free .order4 {order: 4;}
	.list-free .align-self-start {align-self: flex-start;}
	.list-free .align-self-center {align-self: center;}
	.list-free .align-self-end {align-self: flex-end;}
}