@charset "utf-8";

/* Common
----------------------------------------------------*/
.flexBox{
	width: 100%; display:-webkit-box; display:-moz-box;display:-webkit-flexbox;display:-moz-flexbox;display:-ms-flexbox;display:-webkit-flex;	display:-moz-flex;display:flex;	justify-content:center;align-content:flex-start;
}
.flexBox .flexItem{
	padding:10px 5px;
}
.block{padding: 20px 10px;}
.block .title{text-align: left;}
.block .caption{text-align: left;font-size:0.85rem;}
.pcOnly{display: inline;}
.spOnly{display: none;}

.btnBox{padding:20px;}
.button,.btnMini {
	background-color: var(--maincolor-grn);
	color: var(--maincolor-wht);
	font-weight: 600;
	letter-spacing: 0.2em;
	border: 0;
	border-radius:30px;
	display: inline-block;
	padding: 15px 25px;
	min-width: 300px;
	line-height: 1.2;
	box-shadow: 0px 0px 7px -3px var(--maincolor-gry);
	transition: .2s;
	text-align: center;
}
.btnMini {min-width:150px;padding: 5px 10px;font-weight: 500;letter-spacing:0;}
.button:hover,.btnMini:hover, .button:focus,.btnMini:focus {
	box-shadow: none;
	opacity: 0.5;
	transition: .2s;
}

.imgBox.fill {padding: 10px 0; height: 300px;width: 100%;}
.imgBox.fill img{object-fit: cover;width: 100%;
	height: 100%;}

.iframeContent{padding: 40px 10px;width: 100%;}
.iframeContent iframe{width: 100%;}

.banner{padding: 20px 0; width: 100%;}
.banner .titleBox{padding: 10px 0;}

.line-dotted {
	height: 5px;
	position: relative;
  }
.line-dotted::before {
	content: "";
	background: radial-gradient(circle farthest-side, var(--maincolor-yel), var(--maincolor-yel) 60%, transparent 60%, transparent);
    background-size: 10px;
    content: '';
    display: inline-block;
    height: 10px;
    width: 100%;
  }
  table{margin: 0 auto;}
  table th, table td{padding: 10px; border-bottom: 3px dotted;text-align: left;}
  table th{vertical-align:top; color:var(--fontcolor-p);}


.tab-wrap {
	background: White;
	display: flex;
	flex-wrap: wrap;
	overflow: hidden;
	padding: 0 0 20px;
}

.tab-label {
	cursor: pointer;
	flex: 1;
	font-weight: bold;
	order: -1;
	padding: 12px 5px;
	position: relative;
	text-align: center;
	transition: cubic-bezier(0.4, 0, 0.2, 1) .2s;
	user-select: none;
	white-space: nowrap;
	-webkit-tap-highlight-color: transparent;
	box-shadow: 0px 0px 7px -3px var(--maincolor-gry);
	border: 2px solid var(--maincolor-grn);
	background: #ffff;
	border-radius: 5px 5px 0 0;
}

.tab-label:hover {
	background: var(--maincolor-yel);
}

.tab-switch:checked + .tab-label {
	color: #fff;
	background:var(--maincolor-grn);
	border: 2px solid #007d4f;
}

.tab-label::after {
	background:var(--maincolor-grn);
	bottom: 0;
	content: '';
	display: block;
	height: 3px;
	left: 0;
	opacity: 0;
	pointer-events: none;
	position: absolute;
	transform: translateX(100%);
	border: 2px solid var(--maincolor-yel);
	transition: cubic-bezier(0.4, 0, 0.2, 1) .2s 80ms;
	width: 100%;
	z-index: 1;
}

.tab-switch:checked ~ .tab-label::after {
	transform: translateX(-100%);
}

.tab-switch:checked + .tab-label::after {
	opacity: 1;
	transform: translateX(0);
}

.tab-content {
	height:0;
	opacity:0;
	padding: 0 ;
	pointer-events:none;
	transform: translateX(-30%);
	transition: transform .3s 80ms, opacity .3s 80ms;
	width: 100%;
}

.tab-switch:checked ~ .tab-content {
	transform: translateX(30%);
}

.tab-switch:checked + .tab-label + .tab-content {
	height: auto;
	opacity: 1;
	order: 1;
	pointer-events:auto;
	transform: translateX(0);
}

.tab-wrap::after {
	content: '';
	height: 20px;
	order: -1;
	width: 100%;
}

.tab-switch {
	display: none;
}
.tab-content .flexBox .imgBox{width:55%}
.tab-content .flexBox .caption{width:45%; padding: 0 10px;}

.tab-content .title h3 img{width: 3em; padding-right: 0.5em;vertical-align: middle;}
.tab-content .title h3 {vertical-align: middle; padding-bottom: 10px;}
.tab-content .p{padding:0 10px;}


/* Header
----------------------------------------------------*/
.globalHeader {
	height: 65px;
	position: relative;
	background: var(--maincolor-wht);
	z-index: 100;
}

.globalHeader .ghContents {
	height: 65px;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	width: 100%;
	margin: 0 auto;
	padding-right: 20px;
	padding-left: 20px;
	z-index: 100;
	justify-content: space-between;
	align-items: center;
	z-index: 999;
	top: 0;
	background: var(--maincolor-wht);
	transition: .5s;
}
.globalHeader.sticky{position: fixed;}
.globalHeader.sticky .ghContents,.globalHeader:not(.topPage) .ghContents{
	background: var(--maincolor-wht);
	transition: .5s;
}

.globalHeader.sticky .ghContents {
	transition: .5s;
}

.globalHeader .ghLogo {
	width: 45px;
	z-index: 9999;
	border-bottom: none;
}

.globalHeader .ghLogo img {
	height: 100%;
	width: 100%;
	object-fit: contain;
	object-position: center;
	vertical-align: middle;
}

.globalHeader .ghNavButton {
	display: none;
	width: 60px;
	text-align: center;
	cursor: pointer;
	z-index: 99999;
}
.globalHeader .ghNavButton:hover{opacity: 0.5;}

.globalHeader .ghNavButton i {
	font-size: 2rem;
}

.globalHeader .ghNav {
	display: flex;
	justify-content: center;
	align-items: center;
}

.globalHeader .ghNav .navItem {
	display: inline-block;
	text-align: center;
	color: inherit;
	position: relative;
}
.globalHeader .ghNav .subNav {
	display: none;
}
.globalHeader.sticky .ghContents .subNav,
.globalHeader .ghContents .subNav{
}
.globalHeader .line-dotted{margin-top: -20px;}
@media screen and (min-width:981px) {
.globalHeader .ghNav .navItem:hover .subNav,.globalHeader .ghNav .navItem.opened .subNav{
	display: block;
	position: absolute;
	left: 0;
	top: 90%;
	width: 100%;
	background: var(--bg-yel);
}

}
.globalHeader .ghNav .navItem .label {
	font-size: 1rem;
	padding: 15px;
	text-transform: uppercase;
	font-family: 'Zen Maru Gothic', sans-serif;
	color: var(--fontcolor-title);
}
.globalHeader .ghNav .subNav .label {
	font-size: 0.75rem;
}
.globalHeader.sticky .ghNav .navItem .label,.globalHeader:not(.topPage) .ghContents {
	color: var(--fontcolor-title);
}

.movieBox{width: 100%; height: 100vh; position: relative;}
.movieBox a{position: absolute;
top: 0;
left: 0%;
color: var(--maincolor-wht);
width: 100%;
height: 100%;
}
.movieBox a i{font-size: 1.5rem;}
.movieBox a p{position: absolute;
	bottom: 30px;
	left: 50%;font-size: 1.5rem;}
.movieBox video{width: 100%; height: 100%; object-fit: cover;}

.youtubeBox {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}

.iframe {
	position: absolute;
		top: 0;
		right: 0;
		width: 100%;
		height: 100%;
}

/* ------------------------------------------------------------------------------
	slider 
-------------------------------------------------------------------------------*/

.slick-arrow{
	position: absolute;
	top: 50%;
	font-size: 1.5rem;
	transform: translateY(-50%);
	transition: .3s;
}
.slick-arrow:hover{opacity: 0.5;transition: .3s;}
.slick-arrow.slick-arrowNext{right: 0px;}
.slick-arrow.slick-arrowPrev{left: 0;}
.slick-dots{
	list-style: none;
	display: flex;
	justify-content: center;
	align-items: center;
	padding-top: 10px;
}
.slick-dots li{
	position: relative;
		display: inline-block;
	padding: 10px 0;
	margin: 0 5px;
	padding: 0;
	cursor: pointer;}
.slick-dots > li:first-child:last-child {
    display: none;
}
	.slick-dots li button {
		font-size: 0;
		line-height: 0;
		display: block;
		width: 10px;
		height: 10px;
		padding: 5px;
		cursor: pointer;
		color: transparent;
		border: 0;
		outline: none;
		border: 1px solid var(--maincolor-gry);
		background: transparent;
		border-radius: 50%;
		transition: .3s;
	}
	.slick-dots li button:hover{background: var(--maincolor-gry); opacity: 0.5;transition: .3s;}
	.slick-dots li.slick-active button{background: var(--maincolor-gry);transition: .3s;}
	
	ol.cir {
		counter-reset: counter;
		list-style: none;
	  }
	  ol.cir li {
		position: relative;
		padding-left: 1.5em;
	  }
	  ol.cir li:before {
		counter-increment: counter;
		content: counter(counter);
		position: absolute;
		top: 0.5em;
		left: 0;
		width: 18px;
		height: 18px;
		-webkit-transform: translate(0,-0.3em);
		transform: translate(0,-0.3em);
		border: 1px solid var(--maincolor-gry);
		background:var(--maincolor-gry);
		border-radius: 50%;
		font-size: 80%;
		color: #fff;
		text-align: center;
		line-height: 1.2;
	  }
	
/* main
----------------------------------------------------*/
[data-ruby] {
    position: relative;
}
[data-ruby]::before {
    content: attr(data-ruby);
    position: absolute;
    top: -1.8em;
    left: 0;
    right: 0;
    margin: auto;
    font-size: 0.3em;
}
.headerImg {border-bottom: none;}
.topViewSection{padding: 0;}
.sectionArticle{padding-top:0;}
.sectionHeader{width: 100%;}

.blogContent .caption,.blogContent .subheading{text-align: left;}
.blogContent .subheading{}
.blogContent .subheading2{}
.blogHeader{text-align: left; background-color:var(--bg-yel); padding: 20px;}
/* ------------------------------------------------------------------------------
	news
-------------------------------------------------------------------------------*/
.sectionNews .newsTable th{vertical-align:top;}
.recruitTable th{min-width: 85px;width: auto; border-bottom: none;}
.sectionNews .newsTable td,.recruitTable td{line-height: 1.5; width: 100%; padding-left: 20px;}
.recruitTable td{padding-bottom: 5px; border-bottom:none}
.recruitTable td .container{padding: 10px 15px; border-radius: 3px;}

h5.scoreTitle,#score .h5{border-bottom: 3px dotted;}
.article p{padding-bottom: 5px;}

/* ------------------------------------------------------------------------------
	about us 
-------------------------------------------------------------------------------*/
.sectionAbout .title{line-height: 1.8;}
.sectionAbout .sectionHeader img{max-width: 300px; border-bottom: none;}
.sectionAbout p{font-size: 0.9rem;}

.sectionContents{padding-bottom: 40px;}
.sectionContents:last-of-type{padding-bottom: 20px;}

.sectionNomal{max-width: 800px;margin: 0 auto;}

.memberContainer{padding: 40px 10px;}
.member .flexItem{width: 32%; justify-content: space-between; max-width:250px;}
.member .imgBox {
	max-width: 300px;
}
.member .caption {border-radius:10px; border:2px solid var(--maincolor-yel); padding:10px 0 0;}
.member .caption .name{width:93%;margin:0 auto; padding:5px 0; text-align: center; border-radius:10px; background:var(--maincolor-yel); }
.member .caption .name p.furigana{line-height: 1.1; padding-bottom: 0; font-size: 0.6rem;}
.member .caption .name h5{font-size:1.5rem; }
.member .caption .block {padding-bottom:0;}
.member .caption .block h6{text-align: center;  border-radius:10px;  color:var(--maincolor-grn);border:2px solid var(--maincolor-grn)}
.member .caption .block p{padding:5px 5px 10px;font-size: 0.85rem;}
.snsBox i{font-size: 1.3rem;}

.brandContents .flexItem {
	width: 25%;
	max-width: 200px;
}
.brandContents .flexItem img{padding: 20px 10px; height: 150px; width: 150px; object-fit: contain;}

.share.snsBox i {
	font-size: 1.8rem;
}
.share.snsBox .flexItem{padding: 10px;}

.sectionVision{background:var(--bg-yel);
	background: -webkit-linear-gradient(0deg,#deffa2 1%,#fffbb6 20%,#fffbb6 80%,#deffa2);/* Chrome 10-25, Safari 5.1-6 */                         
	background: linear-gradient(0deg, #deffa2 1%,#fffbb6 20%,#fffbb6 80%,#deffa2);/* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ 
	background-size: cover;
}
.sectionVision .title,
.sectionVision .sectionContents{ font-weight: 600; font-family: "Shippori Mincho B1","ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;}
.sectionVision .sectionContents .title{color: #008666; line-height: 1.5;}
.sectionVision .sectionContents p{padding-top: 40px; font-size: 1rem; font-weight: 500; letter-spacing: 0.05em; line-height: 1.8;   }
.sectionVision .emphasis{font-weight: 600; font-size: 1.5rem; }
.sectionVision .container {border:2px solid var(--maincolor-wht)}

/* ------------------------------------------------------------------------------
	acsess 
-------------------------------------------------------------------------------*/
.caption {text-align: left;}
.caption p{padding-bottom: 10px;}
.sectionAccess .caption{max-width: 600px;  width: 100%;margin: 0 auto;}
.sectionAccess .map{max-width: 600px;width: 100%;height: 450px;}

/* ------------------------------------------------------------------------------
	work 
-------------------------------------------------------------------------------*/

.flexBox.iconBox {padding-bottom: 20px; flex-wrap: wrap; max-width: 500px; margin: 0 auto;}
.flexBox.iconBox .flexItem{
	width:33%;
	text-align: center;
}

.iconBox img{padding:0 5px;}
.iconBox h6{color:var(--maincolor-gry);padding-top:0.5em;}
.container {background: var(--bg-yel); border-radius: 20px; padding:40px 20px;}
.flexBox.worktype{padding: 30px 0 20px;justify-content: space-around;max-width: 300px; margin: 0 auto; text-align: center;} 
.flexBox.worktype .flexItem{ flex-wrap:wrap ; align-items: center; justify-items: center; display:flex; background: #ffbbb6; border-radius: 50%; width: 120px; height: 120px;}
.flexBox.worktype .flexItem:nth-child(2n){background: #ffddb6;}
.flexBox.worktype .flexItem .inner{width: 100%;}

*{
	margin:0;
	padding:0;
	line-height: 1.3em;
  } 
  /* time-schedule */

.schedule .title{padding: 20px 0;}

  .time-schedule {
	margin-top:20px;
	min-width: 115px;
	max-width: 400px;
	list-style: none;
	margin: 0 auto 0 6em;
	padding-left: 20px;
	border-left: 3px dotted var(--maincolor-grn);
	box-sizing: border-box;
  }
  
  .time-schedule li {
	width: 100%;
	margin: 0 0;
	padding: 5px 0;
	position: relative;
  }
  
  .time-schedule span.time {
	width: 5em;
	display: inline-block;
	margin-top: -0.75em;
	margin-left: -8em;
	padding: 0;
	vertical-align: top;
	position: relative;
	text-align: right;
	box-sizing: border-box;
  }
  
  .time-schedule span.time::after {
	content: "";
	position: absolute;
	right: -1.85em;
	top:50%;
	transform:translate(0,-50%);
	background:  var(--maincolor-grn);
	width: 1.2em;
	height: 1.2em;
	border-radius: 50%;
  }
  
  .time-schedule .sch_box {
	display: inline-block;
	width: 100%;
	margin-left: 30px;
	padding: 5px;
	vertical-align: middle;
	box-sizing: border-box;
	border-radius: 6px;
	text-align:left;
	background:var(--maincolor-wht);
  }
  .time-schedule .sch_box:not(.lest) {min-height:80px}
  
  .time-schedule .sch_title {
	font-size: 16px;
	font-weight: 700;
  }
  .time-schedule .sch_title:not(:first-of-type){padding-top: 5px;}
  
  .time-schedule .sch_title .label, .time-schedule .sch_title .label1{
	background:  #7cde7e;
	color: var(--maincolor-wht);
	font-size: 0.75rem;
	padding: 3px;
	border-radius: 3px;
  }
  .time-schedule .sch_title .label1{background: #ffabe4;}
  .time-schedule .sch_tx {
	font-size: 14px;
	font-weight: normal;
  }

  .time-schedule .sch_box ul.sch_tx
  {
	list-style:disc;
	padding-inline-start: 0;
   list-style-position: inside;
  }

  .time-schedule .sch_box ul.sch_tx li
  {
	line-height:1em;
	padding:2px;
  }


/* ------------------------------------------------------------------------------
	comment 
-------------------------------------------------------------------------------*/
.comment .flexItem{padding: 20px 15px;}
.comment .imgBox{width:40%; min-width:200px}
.copy{text-align: right; padding-top: 10px;}

/* ------------------------------------------------------------------------------
	campany 
-------------------------------------------------------------------------------*/
.campanyTable th,.campanyTable td{border-bottom:none}

/* ------------------------------------------------------------------------------
	service 
-------------------------------------------------------------------------------*/
.step {
	padding-left: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px;
	width: 100%;
  }
  
  .step > li {
	list-style-type: none;
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	text-align: left;
  }
  
  .step > li .icon04 {
	line-height: 2;
	width: 2em;
	height: 2em;
	text-align: center;
	color: #fff;
	background: var(--maincolor-grn);
	margin: 0 10px;
	display:inline-block;
	border-radius: 100vh;
	position: relative;
  }
  
  .step > li .icon04::before {
	content: "";
	border: solid transparent;
	border-width: 7px;
	border-style: solid;
  border-left: 7px solid var(--maincolor-grn);
  border-right: 0;
	position: absolute;
	top: calc(50% - 7px);
	left: 100%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	
  }
  
  .step > li dl {
	padding: 20px 10px;
	border-radius: 5px;
	margin: 0;
	background:var(--bg-yel);
	border: 3px solid var(--maincolor-grn);
	position: relative;
	width: 100%;
  }
  
  .step > li:not(:first-child) dl::before {
	content: "";
	width: 14px;
	height: 14px;
	margin-right: 10px;
	display: inline-block;
	border-top: 4px solid var(--maincolor-grn);
	border-right: 4px solid var(--maincolor-grn);
	position: absolute;
	top: -23px;
	left: 50%;
	-webkit-transform: rotate(135deg);
	transform: rotate(135deg);
  }
  
  .step > li dl dt {
	font-size: 1.3em;
	font-weight: 600;
	color: var(--maincolor-grn);
  }
  
  .step > li dl dd {
	text-indent: 1em;
  }
  .step > li dl dd:first-of-type {padding-top: 10px;}
  .ballonImg{padding: 10px 0; display: flex; flex-wrap: nowrap;}
  .ballonImg .imgBox{width: 100px; padding:10px;}
  .balloon{
	position: relative;
	padding: 20px;
	background-color:#ffe0e0;
	border-radius: 10px; 
	text-align: left;
	width: auto;
	margin-left: 20px;
	width: 90%;
  }
  .balloon::before{
	content: '';
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	left: -15px;
	top: 20px;
	border-right: 15px solid #ffe0e0;
	border-top: 15px solid transparent;
	border-bottom: 15px solid transparent;
  }
  .balloon:nth-child(2n+1){background-color:var(--bg-yel);
	margin-left: none;
	margin-right: 20px;}
  .balloon:nth-child(2n+1)::before{
	left: 100%;
	right: 15px;
	border-right: none;
	border-left: 15px solid var(--bg-yel);
	}
  
  @media(max-width: 767px){
	.step {
	  gap: 20px;
	}
	.step > li {
	  display: block;
	}
  }


/* ------------------------------------------------------------------------------
	faq 
-------------------------------------------------------------------------------*/
.faq{text-align: left; padding: 10px;}
.question{background: var(--bg-yel); padding: 2px 10px 5px;border-radius: 3px;text-indent: -1.65em;
	padding-left: 2.1em;}
.question::before{content: 'Q.'; font-size: 1.8rem; }
.answer{padding: 10px;}
.answer .btnMini{margin-top: 5px;}

/* Footer
----------------------------------------------------*/

.globalFooter {
	position: relative;
	background-color: var(--maincolor-wht);
	overflow-x: hidden;
	overflow-y:visible;
	font-family: 'Zen Maru Gothic', sans-serif;
}
.globalFooter .imgBox {position: relative; width: 100vw;height: auto;}
.globalFooter .imgBox img:not(float){max-width: none;width: 100%;height: 100%;object-fit: cover;}
.globalFooter .sprout{text-align: right; padding: 0 20px 0;}
.globalFooter .sprout img{width: auto; height: 50px; object-fit: contain;margin-bottom: -10px;}
.globalFooter .gfContents {
	padding-top: 25px;
	padding-bottom: 30px;
}
.globalFooter .gfContents.flexBox{justify-content: space-between;}
.globalFooter .gfContents .flexItem.brandContent{width: 45%;}
.globalFooter .gfContents .title{color:var(--fontcolor-title); font-size: 1rem;}
.globalFooter .gfContents p{line-height: 2;padding: 10px 0;color:var(--fontcolor-title)}
.globalFooter .toTop {
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index: 9999;
}

.brand a {
	text-align: center;
	border-bottom: none;
}

.brand img.logoBrand {
	padding: 12px;
	width: auto;
	height: 50px;
}

.globalFooter .toTop a {
	display: block;
	z-index: 999;
	width: 55px;
	height: 55px;
	line-height: 55px;
	background-color: var(--maincolor-grn);
	border-radius: 30px;
	color: var(--maincolor-wht);
	text-decoration: none;
	text-align: center;
	box-shadow: 0px 0px 7px -3px var(--maincolor-gry);
}

.globalFooter .toTop:hover {
	opacity: 1;
}

.globalFooter .toTop .zmdi {
	font-size: 3rem;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
}

.globalFooter.toTop:hover .zmdi {
	opacity: 0.6;
}

@media screen and (max-width:980px) {
	.movieBox {	height: 50vh;}
	.flexBox:not(.snsBox):not(.schedule){flex-wrap: wrap;}
	.flexBox .flexItem,.sectionSplit .container.imgBox,.sectionSplit .container.flexBox{width: 100%;}
	.flexBox.snsBox .flexItem{width: auto;}
	.flexBox .flexItem .imgBox{margin: 0 auto;}
	table th,table td{font-size: 0.9rem;}
		.article {
			flex-wrap: wrap-reverse;
		}
	.pcOnly{display: none;}
	.spOnly{display: inline;}

		.globalHeader .ghNavButton {
			display: block;
			z-index: 9999;
		}
		.globalHeader .ghNav{
			opacity: 0;
			position: absolute;
			top: 60px;
			right: -100vw;
			width: 100%;
			height: 100vh;
			padding-bottom: 15px;
			background: var(--maincolor-yel);
			box-shadow: 0 3px 5px rgba(4, 5, 6, 0.1);
			z-index: 100;
			transform-origin: right;
			transition: .5s;
			flex-wrap: wrap;
			justify-content: start;
		}
		.globalHeader .ghNav.opened {
			opacity: 1;
			display: flex;
			right: 0;
			flex-direction: column;
			height: 100vh;
			transition: .5s;
		}
		.globalHeader .ghNav >.navItem {
			width: 100%;
			border-bottom: 3px dotted var(--maincolor-wht);
			max-width: 90%;
		}
		.globalHeader .ghNav .subNav{display: flex;width: 100%; flex-wrap: wrap; }
		.globalHeader .ghNav .subNav .navItem{width: 50%; background: var(--bg-yel); border: 1px solid var(--maincolor-yel); border-radius: 5px;}
		.sectionNews .newsTable tr{flex-wrap: wrap;}
.comment .flexItem img{max-width: 250px;}
.containerHeader .title{line-height:1.1;font-size: 1.4rem;}
.sectionAbout .title {font-size: 1.8rem;}

.schedule .title{font-size: 1.2em;}
.schedule .flexItem{padding: 0 10px;}
.time-schedule .sch_box {width: 95%;
	margin-left: 25px;}
.time-schedule {
	margin: 0px auto 0 4em;
  }
  .time-schedule span.time {
	font-size: 0.95rem;
    letter-spacing: -0.02em;}
  .time-schedule span.time::after {
	right: -1.4em;
	width: 0.8em;
	height: 0.8em;
  }
  .time-schedule .sch_title,.time-schedule .sch_tx  {
	font-size: 0.8em;}

}

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

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

.imgBox.fill {padding: 10px 0; height: 200px;}
	.article .flexItem.sliderWrapper,
		.article .flexItem.textBox {
			width: 100%;
		}
	.article .flexItem .slider {
		width: 100%;height: 450px;padding: 0 10px;
	}
		.flexBox.works .flexItem {
			width: 50%;
		}
		.flexBox.works .flexItem .imgBox{height:62.5vw ;}.flexBox.works.horizontal .flexItem .imgBox,
	.flexBox.works.movie .flexItem .imgBox {
		height: 25vw;
	}
	.slick-arrow.slick-arrowNext {right: -20px;}
	.slick-arrow.slick-arrowPrev {left: -20px;}
	.globalFooter .imgBox {height: 27px;}
	.tab-content .flexBox .imgBox,.tab-content .flexBox .caption{width:100%}

}

@media screen and (max-width: 480px) {
	.sectionHeader, .sectionContents{padding: 20px 10px;}
	.title{font-size: 2rem;}
	.sectionAbout p {font-size: 0.85rem;}
	.globalFooter .imgBox {height: 20px;}
}

@media screen and (max-width: 413px) {
	.title{font-size: 1.8rem;}
	.sectionAbout .title{font-size: 1.4rem;line-height:1.5;}
	[data-ruby]::before {
		top: -1.8em;
	}
	.containerHeader .title{font-size: 1.3rem;}
}

@media screen and (max-width: 374px) {
}
@media screen and (max-width: 319px) {
}