@charset "UTF-8";
/* CSS Document */

#page-top {position: fixed;bottom: 40px;right: 40px;width: 60px; z-index:400;}
@media screen and (max-width: 896px) {
	#page-top {position: fixed;bottom: 5px;right: 5px;width: 30px; z-index:400;}
}

.mont {font-family: "Montserrat", sans-serif; line-height: 1.2;}
.rubik {font-family: "Rubik", sans-serif; line-height: 1.2;}
.mincho {font-family: 'Noto Serif JP', serif;}

.bgWH {background-color: #FFF;}
.bgBR {background-color: #D88D00;}
.bgBE {background-color: #FBF3E5;}
.bgGR {background-color: #004324;}
.bgGRY {background-color: #EEEEEE;}
.txtWH {color: #FFF;}
.txtBR {color: #D88D00;}
.txtGR {color: #004324;}

.ratioBox {position: relative;width: 100%;height: auto;}
.ratio1-1:before {content: "";display: block;padding-top: 100%; /* 1:1 */}
.ratio2-1:before {content: "";display: block;padding-top: 50%; /* 2:1 */}
.ratio3-2:before {content: "";display: block;padding-top: 66%; /* 3:2 */}
.ratio4-3:before {content: "";display: block;padding-top: 75%; /* 4:3 */}
.ratioInner {position: absolute;top: 0; left: 0;width: 100%;height: 100%;}

main {/*min-height: 2000px;*/}
#header {position: fixed; width: 100%; background: #FFF; box-shadow: 0 3px 5px rgba(0,0,0,.4); padding: 30px 40px; z-index: 7;}
.headNavi {opacity: 0; transform: translateY(-20px);}
.headNavi.active {opacity: 1; z-index: 7; transform: translateY(0); transition: .5s;}
.logo {width: 130px;}
.menu:hover > a {background: #004324;}
.child_menu > li > a:hover {background: #FFF;}
.child_menu {width: 100%; left: 0; color: #222; background: #FFF;}
.menu:hover .child_menu {visibility: visible;}
/*.child_menu a:hover {color: #222; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px;}*/
#hanburger {display: none;}
.menu_button {width: 71px; height: 71px; position: fixed; top: 0; right: 0; background: #004324; z-index: 15;}
#hanburger:checked ~ .menu_button {top: 0;}
#hanburger:checked ~ .span2 {display: none;}
#hanburger:checked ~ .span1 {width: 34px; transform: rotate(45deg); top: 35px; right: 19px;}
#hanburger:checked ~ .span3 {width: 34px; transform: rotate(-45deg); top: 35px; right: 19px;}
.global_menu {visibility: hidden; width: 100%; height: 100%; position: fixed; top: 0; left: 0; color: #222; overflow-y: scroll; text-align: center; background: #FFF;}
#hanburger:checked ~ .global_menu {visibility: visible;}
.menu {font-size: 16px; font-weight: 600; white-space: nowrap; line-height: 1.5; border-left: 1px solid #222222; padding: 0 5px;}
.menu a {display: block; width: 100%; padding: 8px 20px;}
.menu a:hover {background: #004324; color: #FFF;}
.menu.blank a {padding-right: 46px; background-image: url("../img/cmn/icon_window.svg"); background-repeat: no-repeat; background-position: right 20px center;}
.menu.blank a:hover {background-image: url("../img/cmn/icon_window_wh.svg"); background-repeat: no-repeat; background-position: right 20px center;}
.menu .pd {display: none;}
.menu:last-child {margin-right: 0px; border-left: none;}
.menu:last-child a {background: #004324; color: #FFF; border-radius: 20px; border: 1px solid #004324; padding: 8px 30px;}
.menu:last-child a:hover {background: #FFF; color: #004324;}
.child_menu > li > a {padding: 15px 0; text-align: left;}
#hanburger,.spOnly {display: none;}
@media screen and (min-width: 985px) {
  .menu_button {display: none;}
  .global_menu {position: relative; padding: 0; color: #fff; visibility: visible; overflow-y: visible; height: auto; width: auto;}
  .menu:hover > a {background: #004324; color: #FFF;}
  .child_menu {width: 280px; position: absolute; top: 0; left: 0; padding: 30px 0 30px; color: #222; visibility: hidden; opacity: 0; transition: .5s top, .5s opacity; z-index: 10;}
	.child_menu::before {position: absolute; content: ''; top: 15px; left: 0; width: 100%; height: calc(100% - 15px); border: 1px solid #CCC;}
  .menu:hover .child_menu {visibility: visible; top: 42px; opacity: 1;}
	.menu:nth-child(3) .child_menu {left: 147px;}
  .child_menu > li {display: block; position: relative; z-index: 1; margin: 0 20px;}
	.child_menu > li::before {position: absolute; content: ''; width: 100%; height: 1px; background: #CCC; left: 0; bottom: 0;}
  .child_menu > li > a {background: #FFF url("../img/cmn/navi_arrow.svg") no-repeat right center; padding: 15px 0;}
  .child_menu > li > a:hover {background: #004324 url("../img/cmn/navi_arrow_wh.svg") no-repeat right center; color: #FFF; padding: 15px 10px;}
}
@media screen and (max-width: 1680px) {
	#header {padding: 30px 20px;}
}
@media screen and (max-width: 1635px) {
	.menu a {padding: 8px 10px;}
	.menu.blank a {padding-right: 31px;}
	.menu.blank a,.menu.blank a:hover {background-position: right 10px center;}
	.menu:last-child a {padding: 8px 20px;}
}
@media screen and (max-width: 1450px) {
	#header {padding: 10px 15px 20px;}
	.menu_wrap {width: 650px; justify-content: flex-end; align-items: center;}
	.menu {margin-top: 10px;}
	.menu a {padding: 5px 10px;}
}
@media screen and (max-width: 985px) {
  .spOnly {display: block;}
	#header {position: relative; padding: 10px 15px; box-shadow: none; background: none;}
	#header.headNavi {position: fixed; width: 100%; background: #FFF; box-shadow: 0 3px 5px rgba(0,0,0,.4); padding: 10px 20px;}
	#header .logo {width: 80px;}
  span.span1,span.span2,span.span3 {width: 29px; height: 1px; background-color: #FFF; position: absolute; right: 21px; transition: .3s; z-index: 100; position: fixed;}
  .span1 {top: 25px;}
  .span2 {top: 35px;}
  .span3 {top: 45px;}
	.menu_wrap {width: 100%;}
  .menu {display: block; border-left: none;}
  .menu > a {padding: 10px 15px; text-align: left; border-bottom: 1px solid #CCC;}
  .menu > a span {margin-right: 10px; width: 30px!important;}
  .menu > a span img {width: 100%;}
  .global_menu {z-index: 10; height: 100vh;}
  .child_menu > li > a,.child_menu > li > ul > li a {padding: 10px 15px; color: #222; text-align: left; border-bottom: 1px dotted #999;}
  .child_menu > li > ul > li a {padding: 15px 20px 15px 35px; position: relative;}
  .child_menu > li > ul > li:last-child a {border-bottom: 1px solid #CCC;}
  .child_menu > li > ul > li a::before {border-top: solid 1px #222; content: ''; left: 20px; position: absolute; top: 50%; width: 10px;}
  .menu .pd {display: inline-block; width: 100%; position: absolute; top: 0; left: 0; height: 100%;}
  .menu_wrap {display: none;}
  #hanburger:checked ~ * .menu_wrap {display: block; opacity: 1; min-height: 100vh; background: rgba(255,255,255,.8); /*position: fixed;*/ top: 0; z-index: 5;}
  #hanburger:checked ~ * .menu {max-height: inherit; overflow-y: visible; padding: 0; margin-left: 0; position: relative;}
	#hanburger:checked ~ * .menu:last-child {margin: 10px; width: calc(100% - 20px);}
  #hanburger:checked ~ * .child_menu {max-height: 0; overflow-y: hidden; visibility: hidden; text-align: left;}
  .menu .child_menu {border-top: 1px solid #DDD; position: relative; opacity: 1; top: 0; margin-left: auto; left: auto; width: auto;}
  .child_menu li {display: block;}
  .menu > label:hover {cursor: pointer; cursor: hand;}
  .menu input[type="checkbox"]:checked ~ .child_menu {max-height: inherit!important; overflow-y: visible; visibility: visible!important;}
	.menu.blank {background-position: right 20px center;}
}

footer {padding: 80px 0; border-top: 5px solid #004324;}
.ftInfo {width: 400px;}
.ftInfo .logo {width: 270px;}
.ftInfo dt {text-align: right; width: 100px; padding-right: 30px;}
.ftInfo dd {width: calc(100% - 100px); border-left: 1px solid #222; padding-left: 30px;}
.ftInfo dt:first-of-type,.ftInfo dd:first-of-type {padding-bottom: 10px;}
.ftInfo li:first-child {margin-right: 40px;}
.footCopy small {font-size: 14px;}
.footNavi {width: 530px;}
.footNavi li {width: 200px; margin-bottom: 30px;}
.footNavi li:nth-child(even) {margin-left: 130px;}
.footNavi li a {color: #004324;}
.footNavi li a span {padding-right: 26px; background: url("../img/cmn/icon_window_gr.svg") no-repeat right center;}
.footNavi .bnr li:first-child {width: 248px; border: 1px solid #CCCCCC; margin-left: 0; margin-right: 20px; margin-bottom: 0;}
.footNavi .bnr li:last-child {width: 88px; border: 1px solid #CCCCCC; margin-left: 0; margin-bottom: 0;}
#ftNavi {display: none;}
@media screen and (max-width: 985px) {
	.ftInfo {width: 320px;}
	.footNavi {width: calc(100% - 320px); padding-left: 40px;}
	.footNavi li {width: 50%;}
	.footNavi li:nth-child(even) {margin-left: 0;}
	footer {margin-bottom: 50px; padding: 40px 0;}
  footer #fnavi {width: 100%;}
	#ftNavi {display: block; background: #004324; position: fixed; z-index: 6; bottom: 0; border-top: 1px solid #FFF; width: 100%;}
	#ftNavi ul {text-align: center; font-size: 10px; font-weight: bold;}
	#ftNavi li {width: 25%;}
	#ftNavi li a {display: block; padding: 5px 0; color: #FFF; border-left: 1px solid #016A39; border-right: 1px solid #002414;}
	#ftNavi li:first-child a {border-left: none;}
	#ftNavi li:last-child a {border-right: none;}
	#ftNavi li span {width: 24px; margin: 0 auto 5px; display: block;}
}
@media screen and (max-width: 760px) {
	footer .col6 {flex-direction: column-reverse;}
	.ftInfo,.footNavi {width: 100%; padding-left: 0;}
	.footNavi li {margin-bottom: 10px; font-size: 14px;}
	.footNavi .bnr {justify-content: center; margin-bottom: 30px;}
	.footNavi .bnr li:first-child {width: 188px; margin-left: 10px; margin-right: 10px;}
	.footNavi .bnr li:last-child {width: 66px; margin-left: 10px; margin-right: 10px;}
	.ftInfo .logo {width: 240px; margin-left: auto; margin-right: auto;}
	.ftInfo .txt20.txt700 {text-align: center;}
	.ftInfo ul {justify-content: center;}
	.footCopy {text-align: center;}
}

.w1300 {width: 100%; max-width: 1332px; padding-left: 0; padding-right: 0;}
.w1680 {width: 100%; max-width: 1680px; padding-left: 0; padding-right: 0;}
.container {width: 100%; max-width: 1212px; padding-left: 0; padding-right: 0;}
.containers {width: calc(100% - 40px); max-width: 888px; padding-left: 0; padding-right: 0;}
.mlr,.container,.containers,.w1680 {margin-left: auto; margin-right: auto;}
.mlr5 {margin-left: 5px; margin-right: 5px;}
.mlr20,.col1,.col2,.col3,.col4,.col5,.col6,.box3,.w46,.w54 {margin-left: 20px; margin-right: 20px;}
.col1 {width: calc(16.6666% - 40px);}
.col2,.box3 {width: calc(33.3333% - 40px);}
.col3 {width: calc(50% - 40px);}
.col4 {width: calc(66.6666% - 40px);}
.col5 {width: calc(83.3333% - 40px);}
.col6 {width: calc(100% - 40px);}
.box4 {width: calc(25% - 30px); margin-left: 15px; margin-right: 15px;}
.w300 {max-width: 300px; width: 100%;}
.full {width: 100%;}
.half {width: 50%;}
.w46 {width: calc(46% - 50px);}
.w54 {width: calc(54% - 50px);}
@media screen and (max-width: 896px) {
  .containers {width: calc(100% - 30px);}
  .mlr20,.col1,.col2,.col3,.col4,.col5,.col6,.box3,.w46,.w54 {margin-left: 15px; margin-right: 15px;}
  .col1 {width: calc(16.6666% - 30px);}
  .col2,.box3 {width: calc(33.3333% - 30px);}
  .col3 {width: calc(50% - 30px);}
  .col4 {width: calc(66.6666% - 30px);}
  .col5 {width: calc(83.3333% - 30px);}
  .col6 {width: calc(100% - 30px);}
  .w46 {width: calc(46% - 30px);}
  .w54 {width: calc(54% - 30px);}
}
@media screen and (max-width: 568px) {
  .col1 {width: calc(33.3333% - 30px);}
  .col2,.col3,.col4,.col5,.col6,.box3,.w46,.w54 {width: calc(100% - 30px);}
  .mlr5 {margin-left: 5px; margin-right: 5px;}
  .box4 {width: calc(50% - 20px); margin-left: 10px; margin-right: 10px;}
}

ul.dot {list-style: disc; margin-left: 1.5em;}
ul.num {list-style: decimal; margin-left: 1.5em;}

table {width: 100%;}
table tr:nth-child(odd) {background-color: #FFF;}
table tr:nth-child(even) {background-color: #EEEEEE;}
table th,table td {padding: 10px 20px; line-height: 1.7; text-align: center; border: 1px solid #CCCCCC;}
table.tblGR th {width: 25%; background: #4A8308; color: #FFF;}
table.tblGR2 th {width: 280px; background: #4A8308; color: #FFF;}
table.tblGR2 td {text-align: left; width: calc(100% - 250px);}
@media screen and (max-width: 568px) {
  table.tblGR th,table.tblGR td {padding: 10px 5px;}
  table.tblGR2 th,table.tblGR2 td {width: 100%; display: block;}
  table.tblGR2 td {border-top: none;}
}

.abs {position: absolute;}
.r10 {border-radius: 10px;}
.r8 {border-radius: 8px;}

.btnCmn {display: inline-block;}
.btnCmn span {position: relative; z-index: 1;}
.btnCmn a {display: block; padding: 5px 70px 5px 0; position: relative;}
.btnWH {color: #004324;}
.btnWH::before,.btnWH::after,.btnGR::before,.btnGR::after {position: absolute; content: ''; top: 50%; transform: translateY(-50%); transition: .3s;}
.btnWH::before,.btnGR::before {width: 54px; height: 100%; border-radius: 5px; border: 1px solid #004324; background: #004324; right: 0;}
.btnWH::after,.btnGR::after {width: 18px; height: 10px; background: url("../img/cmn/arrow_wh.svg") no-repeat center; right: 18px;}
.btnWH:hover {color: #FFF; padding-left: 10px;}
.btnWH:hover::before,.btnGR:hover::before {width: 100%;}
.btnWH:hover::after {right: 8px;}
.btnGR {color: #FFF; background: #004324; border: 1px solid #004324; padding: 13px 90px 13px 20px!important; border-radius: 5px;}
.btnGR:hover {color: #004324; background: #FFF; padding-left: 10px;}
.btnGR::before {height: calc(100% - 26px); border: 1px solid #FFF; background: #FFF; right: 20px;}
.btnGR::after {background: url("../img/cmn/arrow_gr.svg") no-repeat center; right:38px;}
.btnGR:hover::after {right: 28px;}

@keyframes handwriting {
  0% {fill: transparent; stroke-dashoffset: 3000;}
  50% {fill: transparent;}
  100% {fill: #FFF; stroke-dashoffset: 0;}
}
@keyframes mvWrapL {
  100% {transform: translateX(100%);}
}
@keyframes mvWrapR {
  100% {transform: translateX(-100%);}
}
@keyframes txtmask01 {
  0% {transform: translate(101%, 0)}
  40%, 60% {transform: translate(0, 0%)}
  100% {transform: translate(-100%, 0)}
}
@keyframes txtmask02 {
  0% {transform: translate(-100%, 0)}
  40%, 60% {transform: translate(0, 0%)}
  100% {transform: translate(100%, 0)}
}
@keyframes fadeIn {
  0% {opacity: 0;}
  100% {opacity: 1;}
}

.slideInup {opacity: 0; -webkit-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; -webkit-transform: translateY(40px); -ms-transform: translateY(40px); transform: translateY(40px);}
.slideInup.appear {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0);}
.fadein {opacity: 0;}
.fadein.appear {opacity: 1; animation-name: fadeIn; animation-duration: 1.5s; animation-timing-function: ease-out; animation-fill-mode: forwards;}
.slideInLeft {position: relative;}
.slideInLeft::before {position: absolute; content: ''; width: 100%; height: 100%; background: #FFF;}
.slideInLeft.appear::before {width: 0; right: 0; overflow: hidden; transition: 300ms linear;}
.txtmask01,.txtmask02,.ttl .txtmask02.mont {color: transparent; display: inline-block; overflow: hidden; position: relative; transition: color 0ms 450ms;}
.txtmask03,.txtmask04 {color: transparent; display: inline-block; overflow: hidden; position: relative; transition: color 0ms 450ms;}
.txtmask01::after {background: linear-gradient(to right, #004324 0%,#004324 50%,#002112 100%); bottom: 0; content: ''; display: block; left: 0; position: absolute; right: 0; top: 0; transform: translate(0, 100%);}
.txtmask02::after {background: linear-gradient(to right, #002112 0%,#004324 50%,#004324 100%); bottom: 0; content: ''; display: block; left: 0; position: absolute; right: 0; top: 0; transform: translate(0, 100%);}
.txtmask03::after,.txtmask04::after {background: #222; bottom: 0; content: ''; display: block; left: 0; position: absolute; right: 0; top: 0; transform: translate(0, 100%);}
.txtmask04::after {background: #004324;}
.txtmask01.appear,.txtmask02.appear {color: #FFF; /*text-shadow: 3px 3px 3px rgba(0,0,0,.6);*/ text-align: right;}
.txtmask03.appear {color: #222;}
.txtmask04.appear {color: #004324;}
.txtmask01.appear::after {animation: txtmask01 .8s cubic-bezier(0.8, 0, 0.170, 1);}
.txtmask02.appear::after {animation: txtmask02 .8s cubic-bezier(0.8, 0, 0.170, 1);}
.txtmask03.appear::after {animation: txtmask02 .8s cubic-bezier(0.8, 0, 0.170, 1);}
.txtmask04.appear::after {animation: txtmask02 .8s cubic-bezier(0.8, 0, 0.170, 1);}
.ttl .txtmask02.appear {color: #222;}
.ttl .txtmask02.appear.mont {color: #004324;}

.delay01 {transition-delay: .2s;}
.delay02 {transition-delay: .4s;}
.delay03 {transition-delay: .6s;}
.delay04 {transition-delay: .8s;}
.delay05 {transition-delay: 1s;}
.delay06 {transition-delay: 1.2s;}
.delay07 {transition-delay: 1.4s;}
.delay08 {transition-delay: 1.6s;}
.delay09 {transition-delay: 1.8s;}
.delay10 {transition-delay: 2s;}
.delay11 {transition-delay: 2.4s;}
.delay12 {transition-delay: 2.8s;}
.delay13 {transition-delay: 3.2s;}
.delay14 {transition-delay: 3.6s;}

#loading {position: fixed; z-index: 999; width: 100%; height: 100%;	background:#FFF; text-align:center;	color:#222; top: 0; left: 0;}
#count {position: absolute;	top: 50%;	left: 50%; z-index: 999; width: 100%;	transform: translate(-50%, -50%);	color: #222;}
#count svg{height: 5px;}

#top01 {z-index: 3; width: 100%; overflow-x: hidden; background: #FFF;}
.topNavi,#top01 .copy,#top01 .line,#top01 .obj02 {position: absolute;}
.topNavi {top: 60px; left: 80px; z-index: 5;}
.topNavi .logo {width: 180px;}
.topNavi li a {display: block; color: #FFF; border-left: 1px solid #FFF; padding: 8px 20px; line-height: 1.5;}
.topNavi li a span {padding-right: 26px; background: url("../img/cmn/icon_window_wh.svg") no-repeat right center;}
#top01 .copy {width: 100%; top: calc(50% - 177px); transform: translateY(-50%); z-index: 4;}
#top01 .copy p {/*text-shadow: 3px 3px 3px rgba(0,0,0,.6);*/}
#top01 .copy .mont {font-size: 100px; margin-right: 30px; line-height: 1;}
#top01 .copy .mont.appear,#top01 .copy .txt40.appear {text-shadow: 3px 3px 3px rgba(0,0,0,.6);}
#top01 .copy .mont span {font-size: 80%; display: block; margin-bottom: -10px;}
#top01 .copy .mont span.and {font-size: 60%; display: inline-block; margin: 0 .2em 0;}
#top01 .copy .txt40 {line-height: 1.2; margin-bottom: 10px;}
#top01 .copy .txt40 span {font-size: 75%;}
#top01 .line {width: 100%; top: calc(50% - 177px); transform: translateY(-50%); z-index: 3; opacity: .5;}
#top01 .line.appear path {fill: none; stroke: #FFF; stroke-dasharray: 3000; stroke-dashoffset: 8000; stroke-width: 100; stroke-linecap: round; stroke-linejoin:round; stroke-miterlimit: 10; animation: handwriting 500ms ease-in forwards;}
#top01 .obj01 {position: absolute;}
#top01 .obj01,#top01 .obj02 {width: 920px; top: 0; left: -50px; z-index: 2; opacity: .7;}
#top01 .obj02 {opacity: 1; z-index: -1; position: relative;}
.obj01.appear path,.obj02.appear path {fill: none; stroke: #FFF; stroke-dasharray: 3000; stroke-dashoffset: 8000; stroke-width: 250; stroke-linecap: round; stroke-linejoin:round; stroke-miterlimit: 10; animation: handwriting 500ms ease-in forwards;}
#top01 .mvMain,#top01 .mvSub {height: 100vh; max-height: 1050px; position: absolute; top: 0; overflow: hidden}
#top01 .mvMain {width: 868px; clip-path: polygon(0 0 , 100% 0, 67.5% 100%, 0 100%); z-index: 1;}
#top01 .mvMain::before {animation: mvWrapL .8s cubic-bezier(0.4, 0, 0.2, 1) forwards; background: #fff; content: ''; inset: 0; pointer-events: none; position: absolute; z-index: 1; animation-delay: 2.5s;}
#top01 .mvSub {width: calc(100% - 868px + 32.5%); clip-path: polygon(0 0 , 100% 0, 100% 100%, 0 100%); position: absolute; right: 0;}
#top01 .mvSub::before {animation: mvWrapR .8s cubic-bezier(0.4, 0, 0.2, 1) forwards; background: #fff; content: ''; inset: 0; pointer-events: none; position: absolute; z-index: 1; animation-delay: 2.5s;}
#top01 .mvSlide {height: 100%; margin-bottom: 0!important;}
#top01 .mvSlide li {height: 100vh; max-height: 1050px;}
#top01 .inner {width: 100%; height: 100%;}
#top01 .inner > video {position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); min-width: 100%; min-height: 100%;}
#top02 {margin-top: -177px; z-index: 6;}
#top02 .newsArea {border-top: 1px solid #CCCCCC;}
.newsArea li {border-bottom: 1px solid #CCC;}
.newsArea li a {padding: 40px 0; position: relative;}
.newsArea li a:hover {background: #EEE; padding: 40px 10px;}
.newsArea li a::before,.newsArea li a::after {position: absolute; content: ''; top: 50%; transform: translateY(-50%); transition: .3s;}
.newsArea li a::before {width: 54px; height: 38px; border-radius: 5px; border: 1px solid #004324; background: #FFF; right: 0;}
.newsArea li a::after {width: 18px; height: 10px; background: url("../img/cmn/arrow_gr.svg") no-repeat center; right: 18px;}
.newsArea li a:hover::before {background: #004324; right: 10px;}
.newsArea li a:hover::after {background: url("../img/cmn/arrow_wh.svg") no-repeat center; right: 28px;}
#top03 .half {padding: 0 0 0 20px;}
#top03 .half.flex {padding: 180px 20px 0 80px;}
#top03 .mapImg .point {bottom: 0; left: 0; width: 100%; height: 100%;}
#top03 .mapImg .point li {position: absolute; animation: fadeIn 1s ease-in-out alternate;}
#top03 .mapImg .point li:first-child {font-size: 20px; bottom: 24%; left: 35.2%;}
#top03 .mapImg .point li:nth-child(2) {bottom: 30.4%; left: 45.4%; animation-duration: 1.2s;}
#top03 .mapImg .point li:nth-child(3) {bottom: 34.7%; right: 31.3%; animation-duration: 1.4s;}
#top03 .mapImg .point li:nth-child(4) {bottom: 29.8%; right: 27.8%; animation-duration: 1.6s;}
#top03 .mapImg .point li:nth-child(5) {bottom: 0; left: 19.5%; animation-duration: 1.8s;}
#top03 .mapImg .point li::before {position: absolute; content: ''; width: 10px; height: 10px; background: #004324; border-radius: 50%; left: 50%; transform: translateX(-50%); animation: fadeIn 1s ease-in-out infinite alternate;}
#top03 .mapImg .point li:first-child::before {width: 15px; height: 15px; top: -10px;}
#top03 .mapImg .point li:nth-child(2)::before {bottom: -10px;}
#top03 .mapImg .point li:nth-child(3)::before {bottom: -5px;}
#top03 .mapImg .point li:nth-child(4)::before {top: -5px;}
#top03 .mapImg .point li:nth-child(5)::before {top: -5px;}
#top03 .mont {transform: rotate(90deg); left: -58px; top: 175px;}
#top03 .inner {top: 130px; left: 220px; z-index: 1;}
#top04 .serviceSlide {margin-left: calc(15.7% - 15px);}
#top04 .slideBox {width: 550px; margin: 0 15px; position: relative; overflow: hidden;}
#top04 .inner {position: absolute; bottom: 0; z-index: 1; padding: 30px 40px 80px; border-radius: 0 0 10px 10px; text-shadow: 2px 2px 2px #000; background: rgba(0, 67, 36, 5); background: linear-gradient(0deg, rgba(0, 67, 36, 0.5) 0%, rgba(0, 67, 36, 0) 100%);}
#top04 .slideBox a {position: relative;}
#top04 .slideBox a::before,#top04 .slideBox a::after {position: absolute; content: ''; transition: .3s; z-index: 2;}
#top04 .slideBox a::before {width: 54px; height: 38px; border-radius: 5px; border: 1px solid #004324; background: #004324; right: 40px; bottom: 30px;}
#top04 .slideBox a::after {width: 18px; height: 10px; background: url("../img/cmn/arrow_wh.svg") no-repeat center; right: 58px; bottom: 43px;}
#top04 .slideBox a:hover::before {border: 1px solid #004324; background: #FFF;}
#top04 .slideBox a:hover::after {background: url("../img/cmn/arrow_gr.svg") no-repeat center;}
#top04 .slideBox a img {transition: .3s;}
#top04 .slideBox a:hover img {transform: scale(1.2); transition: .3s;}
.slideArrow {position: absolute; top: 50%; transform: translateY(-50%); width: 60px; height: 60px; background-color: #004324; cursor: pointer; z-index: 1;}
.slideArrow:hover {background-color: #FFF;}
.prevArrow {left: 0; background-image: url("../img/cmn/arrow_wh_l.svg"); background-repeat: no-repeat; background-position: center; border-radius: 0 5px 5px 0;}
.nextArrow {right: 0; background-image: url("../img/cmn/arrow_wh.svg"); background-repeat: no-repeat; background-position: center; border-radius: 5px 0 0 5px;}
.prevArrow:hover {background-image: url("../img/cmn/arrow_gr_l.svg"); background-repeat: no-repeat; background-position: center;}
.nextArrow:hover {background-image: url("../img/cmn/arrow_gr.svg"); background-repeat: no-repeat; background-position: center;}
#top05 {border-top: 5px solid #004324; background: rgba(72,118,75,.1); overflow: hidden;}
#top05 .container {padding: 235px 0; position: relative; z-index: 2;}
#top05 .col6 p,#top05 .col6 h2 {background: #FFF; display: inline-block; border-radius: 5px; padding: 0 15px;}
#top05 .col6 .btnCmn a {padding-left: 20px;}
#top05 .col6 .btnCmn .btnWH::before {height: 60%;}
#top05 .bgImg {position: absolute; width: 100%; height: 100%; top: 0; z-index: 1;}
@keyframes fadeInOut {
  0% {opacity: 0;}
  25% {opacity: 0.75;}
  50% {opacity: 1;}
  75% {opacity: 0.75;}
  100% {opacity: 0;}
}
.fadeinout {opacity: 0;}
.randam.appear .fadeinout {/*opacity: 1;*/ animation-name: fadeInOut; animation-duration: 6s;}
#top05 .randam li {animation-iteration-count: infinite; position: absolute; z-index: 1;}
#top05 .bgImg01 li:first-child {width: 13.9%; top: -50px; left: -3%;}
#top05 .bgImg01 li:nth-child(2) {width: 23.5%; top: 178px; left: 10.9%; animation-delay: .4s;}
#top05 .bgImg01 li:nth-child(3) {width: 26.4%; bottom: -385px; left: -3%; animation-delay: 1.4s;}
#top05 .bgImg01 li:nth-child(4) {width: 26.4%; top: -5px; left: 50%; transform: translateX(-50%); animation-delay: .2s;}
#top05 .bgImg01 li:nth-child(5) {width: 26.4%; bottom: -5px; left: 50%; transform: translateX(-50%); animation-delay: .8s;}
#top05 .bgImg01 li:nth-child(6) {width: 20.9%; top: -80px; right: 6.3%; animation-delay: 1s;}
#top05 .bgImg01 li:nth-child(7) {width: 23.5%; bottom: 183px; right: 10.9%; animation-delay: .6s;}
#top05 .bgImg01 li:nth-child(8) {width: 13.9%; bottom: -50px; right: -3%; animation-delay: 1.2s;}

#top05 .bgImg02 li:nth-child(1) {width: 23.5%; top: -10px; left: -10px; animation-delay: .2s;}
#top05 .bgImg02 li:nth-child(2) {width: 16.7%; bottom: -20px; left: 5.3%;}
#top05 .bgImg02 li:nth-child(3) {width: 23.5%; top: 80px; left: 25.9%; animation-delay: .6s;}
#top05 .bgImg02 li:nth-child(4) {width: 13.9%; bottom: -10px; left: 29%; animation-delay: 1.2s;}
#top05 .bgImg02 li:nth-child(5) {width: 26.5%; top: -30px; right: 18.2%; animation-delay: .8s;}
#top05 .bgImg02 li:nth-child(6) {width: 20.9%; bottom: 25px; right: 29.1%; animation-delay: 1.4s;}
#top05 .bgImg02 li:nth-child(7) {width: 13.9%; top: -10px; right: -10px; animation-delay: 1;}
#top05 .bgImg02 li:nth-child(8) {width: 22.1%; bottom: -10px; right: -10px; animation-delay: .4s;}

#top05 .bgImg03 li:nth-child(1) {width: 26.5%; top: 60px; left: 6%;}
#top05 .bgImg03 li:nth-child(2) {width: 23.5%; bottom: -60px; left: -10px; animation-delay: .3s;}
#top05 .bgImg03 li:nth-child(3) {width: 22%; bottom: 0; left: 32.5%; animation-delay: 1.4s;}
#top05 .bgImg03 li:nth-child(4) {width: 13.9%; top: 15px; right: 35%; animation-delay: .9s;}
#top05 .bgImg03 li:nth-child(5) {width: 16.7%; top: 80px; right: 9%; animation-delay: .6s;}
#top05 .bgImg03 li:nth-child(6) {width: 20.9%; bottom: -20px; right: -20px; animation-delay: 1.2s;}

#top05 .bgImg04 li:nth-child(1) {width: 20.9%; top: 50%; transform: translateY(-50%); left: 0.5%; animation-delay: .9s;}
#top05 .bgImg04 li:nth-child(2) {width: 23.5%; top: -70px; left: 21.4%; animation-delay: .3s;}
#top05 .bgImg04 li:nth-child(3) {width: 13.9%; bottom: -8px; left: 21.4%; animation-delay: 1.2s;}
#top05 .bgImg04 li:nth-child(4) {width: 26.4%; bottom: -10px; left: 50%; /*transform: translateX(-50%);*/}
#top05 .bgImg04 li:nth-child(5) {width: 26.4%; top: 20px; right: 7.1%; animation-delay: .6s;}
#top05 .bgImg04 li:nth-child(6) {width: 13.9%; bottom: -5px; right: -5px; animation-delay: 1.4s;}

#top05 .bgImg05 li:nth-child(1) {width: 16.6%; top: -20px; left: -1.8%; animation-delay: .6s;}
#top05 .bgImg05 li:nth-child(2) {width: 13.9%; top: 60px; left: 21.2%; animation-delay: 1.4s;}
#top05 .bgImg05 li:nth-child(3) {width:26.4%; bottom: 40px; left: 14.9%; animation-delay: 1.2s;}
#top05 .bgImg05 li:nth-child(4) {width: 23.5%; top: 47px; left: 41.3%;}
#top05 .bgImg05 li:nth-child(5) {width: 22%; bottom: -20px; right: 21%; animation-delay: .9s;}
#top05 .bgImg05 li:nth-child(6) {width: 16.6%; top: 84px; right: 4.4%; animation-delay: .3s;}

#top05 .typeCopy {color: #E7EBE7; font-size: 300px; height: calc(100% + 100px); top: -50px; bottom: -50px;}
#top05 .typeCopy ul {position: absolute; display: flex;}
#top05 .typeCopy ul li {width: 4800px; line-height: 1; margin: 0 30px;}
#top05 .typeCopy ul:first-child {top: 0; left: 0; animation: loopLeft 60s infinite linear both;}
#top05 .typeCopy ul:nth-child(2) {top: 31%; left: 50%; animation: loopRight 80s infinite linear both;}
#top05 .typeCopy ul:last-child {bottom: 0; left: 0; animation: loopLeft 100s infinite linear both;}
@keyframes loopLeft {
  from {transform: translateX(0);}
  to {transform: translateX(-100%);}
}
@keyframes loopRight {
  from {transform: translateX(-100%);}
  to {transform: translateX(0);}
}
@media screen and (max-width: 1450px) {
	#top01 .copy .mont {font-size: 80px;}
	#top01 .copy .txt40 {font-size: 36px;}
}
@media screen and (max-width: 1400px) {
	#top03 .half.flex {padding: 130px 20px 250px 170px;}
	#top03 .inner {position: relative; top: 0; left: 0;}
	#top03 .mapImg {position: absolute; bottom: 0;}
}
@media screen and (max-width: 1360px) {
	.topNavi {left: 40px;}
	#top01 .copy,#top01 .line {top: calc(50% - 108px);}
	#top01 .obj01, #top01 .obj02 {width: 680px;}
	#top01 .mvMain, #top01 .mvSub,#top01 .mvSlide li {max-height: 775px;}
	#top01 .mvMain {width: 625px; clip-path: polygon(0 0 , 100% 0, 67% 100%, 0 100%);}
	#top01 .mvSub {width: calc(100% - 625px + 32.5%);}
	#top02 {margin-top: -108px;}
}
@media screen and (max-width: 1230px) {
	#top01 .copy .mont {font-size: 70px;}
	#top01 .copy .txt40 {font-size: 30px;}
}
@media screen and (max-width: 1120px) {
	#top01 .copy {justify-content: flex-end; padding-right: 40px;}
	#top05 .container {padding: 155px 0;}
	#top05 .typeCopy {font-size: 260px;}
}
@media screen and (max-width: 1024px) {
	#top03 .half {width: 100%;}
	#top03 .half.flex {padding: 0 20px 250px 110px;}
	#top03 .mont {left: -98px;}
	#top03 .mapImg {right: 0;}
}
@media screen and (max-width: 985px) {
	#top01 .topNavi {top: 20px; left: 20px;}
	#top01 .topNavi ul {display: none;}
	#top01 .copy {justify-content: center; padding-right: 0;}
	#top03 .mont {left: -50px; top: 40px;}
	#top03 .half {height: 300px;}
	#top03 .half.flex {padding: 0 20px 300px 90px; height: auto;}
	#top04 .serviceSlide {margin-left: 20px;}
	#top05 .container {padding: 100px 0;}
	#top05 .typeCopy {font-size: 200px;}
}
@media screen and (max-width: 690px) {
	#top01 .topNavi {top: 20px; left: 20px;}
	#top01 .topNavi ul {display: none;}
	.topNavi .logo {width: 140px;}
	#top01 .copy {flex-direction: column; align-items: center;}
	.txtmask01 .txtRight {text-align: center;}
	.txtmask01.appear, .txtmask02.appear {text-align: center;}
	.txtmask02 {margin-top: 20px;}
	#top01 .copy .mont {margin-right: 0;}
	#top01 .copy .mont.appear, #top01 .copy .txt40.appear {text-align: center;}
	#top01 .copy .txt40 br {display: none; margin-top: 20px;}
	#top01 .obj01, #top01 .obj02 {width: 450px; left: -70px;}
	#top01 .mvMain {width: 378px; clip-path: polygon(0 0 , 100% 0, 61.1% 100%, 0 100%);}
	#top01 .mvMain, #top01 .mvSub, #top01 .mvSlide li {max-height: 542px;}
	#top01 .mvSub {width: calc(100% - 380px + 38.9%);}
	#top02 {margin-top: -38px;}
	#top04 .slideBox {width: 300px; margin: 0 10px;}
	#top04 .inner {padding: 10px 20px 60px;}
	#top04 .slideBox a::before {right: 20px; bottom: 10px;}
	#top04 .slideBox a::after {right: 38px; bottom: 23px;}
	.prevArrow {left: -20px;}
	.slideArrow {width: 40px; height: 40px;}
	.supportSlide .prevArrow {left: 0;}
}
@media screen and (max-width: 475px) {
	.topNavi .logo {width: 100px;}
	#top01 .copy .mont {font-size: 12vw;}
	#top01 .copy .txt40 {font-size: 20px;}
	#top01 .obj01, #top01 .obj02 {width: 330px; left: -50px;}
	#top01 .mvMain {width: 277px; clip-path: polygon(0 0 , 100% 0, 63% 100%, 0 100%);}
	#top01 .mvMain, #top01 .mvSub, #top01 .mvSlide li {max-height: 385px;}
	#top01 .mvSub {width: calc(100% - 280px + 37%);}
	#top01 .copy, #top01 .line {top: 50%;}
	#top02 {margin-top: 0;}
	#top05 .container {padding: 50px 0;}
	#top05 .typeCopy {font-size: 170px;}
}

#kv {padding-top: 244px;}
#kv .container:nth-of-type(2) h1,#kv .container:nth-of-type(2) h2,.ttlSideBdr {padding-left: 65px; margin-right: 80px;}
.ttlSideBdr {margin-right: 0;}
#kv .container:nth-of-type(2) h1::before,#kv .container:nth-of-type(2) h2::before,.ttlSideBdr::before {position: absolute; content: ''; width: 50px; height: 1px; background: #004324; left: 0; top: 50%; transform: translateY(-50%);}
.kvImg {width: 100%;}
.bread li:not(:last-child) {padding-right: 18px; margin-right: 10px; background: url("../img/cmn/navi_arrow.svg") no-repeat right center; background-size: 8px auto;}
.bread li a {text-decoration: underline;}

.ttlSide::after {position: absolute; content: ''; width: 100%; height: 1px; background: #004324; left: 0; top: 50%; z-index: -1;}
.ttlSide .bgWH {padding: 0 20px;}

.txtSideBdr {padding: 20px 0 0 40px;}
.imgSideBdr::before,.txtSideBdr::before {position: absolute; content: ''; width: 20px; height: 1px; top: 38px;}
.imgSideBdr::before {background: #FFF; border-radius: 1px 0 0 1px; right: 0;}
.txtSideBdr::before {background: #004324; border-radius: 0 1px 1px 0; left: 0;}
.txtTopBdr {padding-top: 30px;}
.imgBtmBdr::before,.txtTopBdr::before {position: absolute; content: ''; width: 2px; height: 20px; left: 20px;}
.txtTopBdr::before {top: 0; background: #004324; border-radius: 0 0 1px 1px;}
.imgBtmBdr::before {bottom: 0; background: #FFF; border-radius: 1px 1px 0 0;}
@media screen and (max-width: 985px) {
	#kv {padding-top: 20px;}
}
@media screen and (max-width: 560px) {
	.txtSideBdr {padding: 20px 0 0 0;}
	.imgSideBdr::before,.txtSideBdr::before { width: 1px; height: 20px; top: inherit; bottom: 0;}
	.imgSideBdr::before {border-radius: 1px 1px 0 0; right: inherit; left: 20px;}
	.txtSideBdr::before {border-radius: 0 0 1px 1px; left: 20px; top: 0; bottom: inherit;}
}

#service .col6 {border-bottom: 1px solid #CCC;}
#service .txtArea {width: 57.3%; padding-left: 50px;}
#service .mainImg {width: 42.7%;}
@media screen and (max-width: 650px) {
	#service .txtArea,#service .mainImg {width: 100%; padding-left: 0;}
}

#support01 {padding-bottom: 80px; background: url("../img/business/listing_support/01-10.svg") no-repeat center bottom;}
#support01 h2 {width: 100%;}
#support01 dl {width: 280px; margin-bottom: auto;}
#support01 dt,#support01 dd {margin-bottom: 20px;}
#support01 dt {width: 120px;}
#support01 dd {width: calc(100% - 120px); padding-left: 20px;}
#support01 .copy {writing-mode: vertical-rl; position: relative; padding-top: 20px; letter-spacing: .2em;}
#support01 .copy::after {position: absolute; content: ''; width: 4px; height: calc(100% - 40px); background: #004324; top: 0; left: 50%; transform: translateX(-50%); z-index: -1; border-radius: 2px;}
.solution {width: 685px;}
.solution .subImg {width: 42%;}
.solution .txtArea {width: 58%;}
#support01 .illust {width: 202px; bottom: 40px; left: 220px;}
.supportSlide li {position: relative; margin: 0 10px;}
.supportSlide h3 {writing-mode: vertical-rl; position: absolute; top: 0; left: 0; letter-spacing: .2em; padding: 10px 15px; border-radius: 10px 0 10px 0;}
#support03 .full {margin-left: 80px;}
#support03 .mainImg {width: 46%;}
#support03 .mainImg li {height: 50%;}
#support03 .mainImg li:first-child .r10 {border-radius: 0 10px 0 0;}
#support03 .mainImg li:last-child .r10 {border-radius: 0 0 10px 0;}
#support03 .txtArea {width: 54%; padding: 0 80px 0 60px;}
#support03 .subImg {width: 37.5%; position: relative;}
#support03 .subTxt {width: 62.5%; padding: 20px 0 0 40px; position: relative;}
#support04 .container .box4 {border: 1px solid #004324;}
#support04 .container .box4 h3 {padding: 10px 20px; background: #3A7C5E; background: linear-gradient(90deg, rgba(58, 124, 94, 1) 0%, rgba(0, 67, 36, 1) 100%);}
#support04 .container .box4 p {padding: 20px;}
#support04 .sideBdr {padding: 0 20px;}
#support04 .sideBdr::before,#support04 .sideBdr::after {position: absolute; content: ''; width: 20px; height: 100%; border: 1px solid #004324; top: 0}
#support04 .sideBdr::before {border-right: none; left: 0;}
#support04 .sideBdr::after {border-left: none; right: 0;}
.graph ul {height: 100%; align-content: space-between;}
.graph li {width: 34%;}
.graph li:first-child,.graph li:nth-child(3) {padding-right: 45px;}
.graph li:last-child,.graph li:nth-child(2) {padding-left: 45px;}
.graph li p,#purchase01 li p {padding: 10px 0 0 15px; margin-left: 15px; border-left: 1px solid #004324;}
.graphImg {width: 32%; margin: 0 auto;}
.notice {padding: 10px 20px; background: #3A7C5E; background: linear-gradient(90deg, rgba(58, 124, 94, 1) 0%, rgba(0, 67, 36, 1) 100%);}
#support05 li {width: 160px; height: 160px; display: flex; flex-direction: column; justify-content: center; border-radius: 50%; color: #79A087; border: 1px solid #79A087;}
#support05 li:nth-child(2) {color: #FFF; background: #79A087;}
#support05 li:nth-child(2),#support05 li:nth-child(3) {margin-left: -20px;}
#support05 .mainImg {width: 69%; top: -60px; z-index: -1; right: 0;}

#franchise01 .w900 {min-width: 900px;}
#franchise01 li {width: 26.5%; position: relative;}
#franchise01 li:nth-child(2),#franchise01 li:nth-child(4) {width: 10.25%;}
#franchise01 li:first-child .subImg::before {position: absolute; content: ''; width: 100%; height: calc(100% - 100px); top: 0; background: #FFF; background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .8) 100%);}
#franchise01 li:first-child .subImg img {border-radius: 5px;}
#franchise01 li:first-child .logo {max-width: 220px; width: 80%; top: 30px; margin: 0 auto; left: 0; right: 0; z-index: 1;}
#franchise01 li:nth-child(2) {display: flex; justify-content: center; align-items: center;}
#franchise01 li:nth-child(3) p,#franchise01 li:nth-child(5) p {padding: 5px 20px; border-radius: 5px 0 5px 0;}
#franchise01 li:nth-child(3) .subImg:first-of-type img,#franchise01 li:nth-child(5) .subImg:first-of-type img {border-radius: 5px 5px 0 0;}
#franchise01 li:nth-child(3) .subImg:last-of-type img,#franchise01 li:nth-child(5) .subImg:last-of-type img {border-radius: 0 0 5px 5px;}
#franchise01 li:nth-child(4) .arrow {height: 50%; display: flex; flex-wrap: wrap; align-content: center; justify-content: center;}
#franchise01 li:nth-child(4) .arrow:first-of-type {color: #AD8500;}
#franchise01 li:nth-child(4) .arrow:last-of-type {color: #00437C;}
#franchise01 li:last-child {width: 100%; display: flex; justify-content: center;}
#franchise01 li:last-child p {padding: 15px 90px 15px 15px; margin-top: 20px; background: url("../img/business/franchise/01-08.svg") no-repeat right 15px center;}
#franchise01 .btnArea {max-width: 670px; width: 100%; margin: 0 auto;}
#franchise01 .btnArea .flex {padding: 40px; position: relative; z-index: 1; color: #FFF;}
#franchise01 .btnArea .flex .txt20,#franchise02 .btnArea .txt20 {padding-right: 70px; position: relative;}
#franchise01 .btnArea .flex .txt20::before,#franchise01 .btnArea .flex .txt20::after,#franchise02 .btnArea .txt20::before,#franchise02 .btnArea .txt20::after {position: absolute; content: ''; top: 50%; transform: translateY(-50%); transition: .3s;}
#franchise01 .btnArea .flex .txt20::before,#franchise02 .btnArea .txt20::before {width: 54px; height: 100%; border-radius: 5px; border: 1px solid #FFF; background: #FFF; right: 0;}
#franchise01 .btnArea .flex .txt20::after,#franchise02 .btnArea .txt20::after {width: 18px; height: 10px; background: url("../img/cmn/arrow_gr.svg") no-repeat center; right: 18px;}
#franchise01 .btnArea .abs,#franchise02 .btnArea .abs {width: 100%; height: 100%; top: 0; left: 0;}
#franchise02 .btnArea {max-width: 848px; width: 100%; margin: 0 auto;}
#franchise02 .btnArea a {padding: 60px 20px; width: 100%; display: block;}
#franchise02 .btnArea p {position: relative; z-index: 1; color: #FFF;}

#company01 {padding: 100px 0; background: url("../img/company/01-01.jpg") no-repeat; background-size: cover;}
#company01 .col6 > li {width: 36.7%; border-width: 5px; border-style: solid; border-radius: 50%;}
#company01 .col6 > li:not(:first-child) {margin-left: -5.05%;}
#company01 .col6 > li:first-child {border-color: #434E89;}
#company01 .col6 > li:nth-child(2) {border-color: #618943;}
#company01 .col6 > li:last-child {border-color: #E89F3C;}
#company01 .col6 > li > ul > li {width: 180px; height: 180px; border-radius: 50%; display: flex; text-align: center; flex-direction: column; justify-content: center; align-items: center; position: absolute;}
#company01 .col6 > li:first-child > ul > li {background: #434E89;}
#company01 .col6 > li:nth-child(2) > ul > li {background: #618943;}
#company01 .col6 > li:last-child > ul > li {background: #E89F3C;}
#company01 .col6 > li:first-child > ul > li:first-child {top: 0; left: 20px;}
#company01 .col6 > li:first-child > ul > li:last-child {bottom: 0; right: 20px;}
#company01 .col6 > li:nth-child(2) > ul > li:first-child {top: -40px; left: 0; right: 0; margin: 0 auto;}
#company01 .col6 > li:nth-child(2) > ul > li:last-child {bottom: -40px; left: 0; right: 0; margin: 0 auto;}
#company01 .col6 > li:last-child > ul > li:first-child {left: -40px; top: 50%; transform: translateY(-50%);}
#company01 .col6 > li:last-child > ul > li:nth-child(2) {top: 0; right: 20px;}
#company01 .col6 > li:last-child > ul > li:last-child {bottom: 0; right: 20px;}

#history dt {width: 180px; margin-right: 40px; margin-bottom: 30px; display: flex; flex-wrap: wrap; align-content: center; position: relative;}
#history dt::after {position: absolute; content: ''; width: 1px; height: 30px; background: #004324; left: 55px; bottom: -30px;}
#history dt.sameYear::after {height: calc(100% + 30px);}
#history dt span.year,#history dt span.month {display: block;}
#history dt span.year span,#history dt span.month span {font-size: 75%;}
#history dt .month {margin-left: auto;}
#history dd {width: calc(100% - 220px); padding-left: 40px; border-left: 1px solid #999; margin-bottom: 30px; display: flex; flex-wrap: wrap; align-content: center;}

.leftContents {position: sticky; top: 150px;}
#company02 .leftContents,#greeting .leftContents {width: 210px;}
#office .leftContents {width: 250px;}
#contact .leftContents {width: 264px;}
.rightContents {padding-left: 80px;}
#company02 .rightContents,#greeting .rightContents {width: calc(100% - 210px);}
#office .rightContents {width: calc(100% - 250px);}
#contact .rightContents {width: calc(100% - 264px);}

.detailInfo dt,.detailInfo dd {padding: 20px 0;}
.detailInfo dt:first-of-type,.detailInfo dd:first-of-type {padding: 0 0 20px;}
.detailInfo dt {width: 240px; border-bottom: 1px solid #004324;}
.detailInfo dd {width: calc(100% - 240px); border-bottom: 1px solid #999;}

#greeting .mincho span {margin-right: 10px;}
.officeInfo dt,.officeInfo dd {margin-bottom: 20px;}
.officeInfo dt {width: 75px; text-align: center; border-left: 2px solid #004324; border-right: 2px solid #004324; margin-right: 20px;}
.officeInfo dd {margin-right: 40px;}
.officeInfo dd span {margin-right: 10px;}
.officeInfo dd:first-of-type {width: calc(100% - 100px); margin-right: 0;}
.officeInfo dd:last-of-type {margin-right: 0;}
.tab {cursor: pointer; padding: 15px 0; border-bottom: 1px solid #004324; background: #FFF url("../img/cmn/navi_arrow.svg") no-repeat right center; position: relative;}
.tab.active {padding: 15px 0 15px 30px; font-weight: 700; color: #FFF; background: #3A7C5E; background: linear-gradient(90deg, rgba(58, 124, 94, 1) 0%, rgba(0, 67, 36, 1) 100%);}
.tabInner {display: none;}
.tabInner.show {display: block;}

@media screen and (max-width: 1150px) {
	#support01 .illust {left: 140px;}
	.solution {width: calc(100% - 360px);}
	#support03 .full {margin-left: 20px;}
	#support03 .mainImg,#support03 .txtArea {width: 100%;}
	#support03 .mainImg li {height: auto; width: 50%;}
	#support03 .mainImg li:first-child .r10 {border-radius: 0 0 0 0;}
	#support03 .mainImg li:last-child .r10 {border-radius: 0 0 0 0;}
	#support03 .txtArea {padding: 0 20px;}
	#support03 .mainImg {display: flex;}
}
@media screen and (max-width: 985px) {
	#support01 dl {width: 240px;}
	#support01 dt {width: 80px;}
	#support01 dd {width: calc(100% - 80px);}
	#support01 .illust {left: 100px;}
	.solution {width: calc(100% - 320px);}
	#support04 .container .box4 {width: calc(50% - 30px);}
	.graph ul {position: relative;}
	.graph li {margin-bottom: 20px;}
	.graph li:first-child,.graph li:nth-child(3) {padding-right: 10px;}
	.graph li:last-child,.graph li:nth-child(2) {padding-left: 10px;}
	.graphImg {position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-50%);}
	#company01 .col6 > li > ul > li {width: 130px; height: 130px;}
	#history dt {width: 120px; margin-right: 20px;}
	#history dd {width: calc(100% - 150px); padding-left: 20px;}
	.officeInfo dd {width: calc(100% - 100px); margin-right: 0;}
	.officeInfo dd:first-of-type {width: calc(100% - 100px); margin-right: 0;}
}
@media screen and (max-width: 900px) {
	#franchise01 .w900 {overflow-x: scroll;}
	.leftContents {position: relative; top: 0;}
	#company02 .leftContents,#greeting .leftContents,#office .leftContents,#contact .leftContents {width: 100%;}
	.rightContents {padding-left: 0;}
	#company02 .rightContents,#greeting .rightContents,#office .rightContents,#contact .rightContents {width: 100%;}
}
@media screen and (max-width: 730px) {
	#support01 dl {width: 100%;}
	#support01 dd {width: calc(50% - 80px);}
	#support01 .copy {writing-mode: horizontal-tb; padding-top: 0; padding-left: 20px; margin-bottom: 20px; width: 100%;}
	#support01 .copy::after {width: 100%; height: 4px; top: 50%; transform: translate(-50%,-50%);}
	.solution {width: 100%;}
	#support01 .illust {left: auto; right: 0; bottom: auto; width: 100px; top: 200px;}
	#company01 {padding: 50px 0;}
	#company01 .col6 > li {width: 54%;}
	#company01 .col6 > li:first-child {margin: 0 auto;}
	#company01 .col6 > li:not(:first-child) {margin-left: -4%;}
}
@media screen and (max-width: 620px) {
	#support01 .illust {width: 70px; top: 260px;}
}
@media screen and (max-width: 580px) {
	.graphImg {position: relative; width: 100%; max-width: 400px; top: 0; transform: translateY(0);}
	.graph ul {align-content: flex-start; height: auto;}
	.graph li {width: 100%;}
}
@media screen and (max-width: 568px) {
	.solution .subImg,.solution .txtArea,#support03 .subImg,#support03 .subTxt {width: 100%;}
	#support03 .subTxt {padding: 20px 0 0 0;;}
	#support04 .container .box4 {width: calc(100% - 20px);}
	#support05 .mainImg {width: 100%; top: -40px; position: relative;}
	.detailInfo dt {padding: 20px 0 0;}
	.detailInfo dd {padding: 10px 0 20px;}
	.detailInfo dt:first-of-type {padding: 0 0 10px;}
	.detailInfo dd:first-of-type {padding: 0 0 20px;}
	.detailInfo dt {width: 100%; border-bottom: none;}
	.detailInfo dd {width: 100%; border-bottom: 1px solid #004324;}
}
@media screen and (max-width: 480px) {
	#support01 dd {width: calc(100% - 80px);}
	#support01 .illust {width: 100px; top: 350px;}
	#support01 .copy {padding-left: 0; padding-bottom: 20px; letter-spacing: 0;}
	#support01 .copy::after {top: auto; bottom: 0; transform: translate(-50%,0);}
	#support05 li {width: 120px; height: 120px;}
	#support05 li:nth-child(2),#support05 li:nth-child(3) {margin-left: -10px;}
	#company01 .col6 > li {width: 80%;}
	#company01 .col6 > li:first-child {margin: 0 auto;}
	#company01 .col6 > li:not(:first-child) {margin-left: auto; margin-right: auto;}
	#history dt {width: 120px; margin-right: 0; margin-bottom: 0;}
	#history dt::after {content: none;}
	#history dt.sameYear::after {content: ''; height: 100%; top: 0; left: 10px;}
	#history dt .month {margin-left: 10px;}
	#history dt.sameYear .month {margin-left: 30px;}
	#history dd {width: 100%; margin-bottom: 0; padding: 10px 0 20px 30px; border-left: none; position: relative;}
	#history dd::after {position: absolute; content: ''; width: 1px; height: 100%; background: #004324; left: 10px; bottom: 0;}
}

.yardInfo .mainImg {width: calc(50% - 20px);}
.yardInfo .txtArea {width: calc(50% + 20px);}
.yardInfo .yardMap {width: 83%; margin-left: auto; margin-top: -20px; position: relative;}
.yardInfo .yardMap .map {width: 75%; height: 350px;}
.yardInfo .yardMap .subImg {width: 31%; right: 0; top: -40px;}
.map iframe {width: 100%; height: 100%;}
@media screen and (max-width: 1100px) {
	.yardInfo .yardMap {margin-top: 20px;}
}
@media screen and (max-width: 850px) {
	.yardInfo .yardMap {width: 100%;}
	.yardInfo .yardMap .subImg {top: -20px;}
}
@media screen and (max-width: 560px) {
	.yardInfo .mainImg,.yardInfo .txtArea,.yardInfo .yardMap .map,.yardInfo .yardMap .subImg {width: 100%;}
	.yardInfo .yardMap .subImg {position: relative; top: 0;}
}

#office .map {height: 400px;}
#health dt {width: 314px; margin-right: 30px; border: 1px solid #CCC;}
#privacy_mark .mark dt {width: 150px; margin-right: 30px;}

.pageNav li {width: 36px; text-align: center; border: 1px solid #004324; border-radius: 5px; margin: 0 5px;}
.pageNav li a {display: block; width: 100%; color: #004324; padding: 3px 0;}
.pageNav li a:hover {color: #FFF; background: #004324;}
.pageNav li.paged {padding: 3px 0; color: #FFF; background: #004324;}
.pageNav li.next,.pageNav li.prev {width: 54px; text-indent: -9999px;}
.pageNav li.prev a {background-image: url("../img/cmn/arrow_gr_l.svg"); background-repeat: no-repeat; background-position: center;}
.pageNav li.next a {background-image: url("../img/cmn/arrow_gr.svg"); background-repeat: no-repeat; background-position: center;}
.pageNav li.prev a:hover {background-image: url("../img/cmn/arrow_wh_l.svg"); background-repeat: no-repeat; background-position: center;}
.pageNav li.next a:hover {background-image: url("../img/cmn/arrow_wh.svg"); background-repeat: no-repeat; background-position: center;}
.date::before {position: absolute; content: ''; width: 100%; height: 1px; background: #004324; left: 0; top: 50%; z-index: -1;}
.date span {padding-right: 20px;}
.post {padding-bottom: 50px; border-bottom: 1px solid #004324;}
.post p:not(:last-child) {margin-bottom: 20px;}
.postNav .prev {margin-right: auto;}
.postNav .list {margin-right: auto; margin-left: auto;}
.postNav .next {margin-left: auto;}
.postNav .prev a,.postNav .next a {color: #004324; position: relative;}
.postNav .prev a:hover,.postNav .next a:hover {color: #FFF;}
.postNav .prev a::before,.postNav .prev a::after,.postNav .next a::before,.postNav .next a::after {position: absolute; content: ''; top: 50%; transform: translateY(-50%); transition: .3s;}
.postNav .prev a {padding: 8px 10px 8px 64px;}
.postNav .next a {padding: 8px 64px 8px 10px;}
.postNav .prev a::before,.postNav .next a::before {width: 54px; height: 100%; border: 1px solid #004324; border-radius: 5px; z-index: -1;}
.postNav .prev a::before {left: 0;}
.postNav .next a::before {right: 0;}
.postNav .prev a::after,.postNav .next a::after {width: 18px; height: 10px;}
.postNav .prev a::after {background: url("../img/cmn/arrow_gr_l.svg") no-repeat center; left: 18px;}
.postNav .next a::after {background: url("../img/cmn/arrow_gr.svg") no-repeat center; right: 18px;}
.postNav .prev a:hover::before,.postNav .next a:hover::before {width: 100%; background: #004324;}
.postNav .prev a:hover::after {background: url("../img/cmn/arrow_wh_l.svg") no-repeat center; left: 18px;}
.postNav .next a:hover::after {background: url("../img/cmn/arrow_wh.svg") no-repeat center; right: 18px;}

#privacy .bgGRY {padding: 30px;}
#privacy dd {margin-left: 1em;}
#privacy dd > ul {padding-left: 1em;}
#contact .leftContents li {padding: 15px 20px; border-bottom: 1px solid #004324; background: #EEEEEE;}
#contact .leftContents li.active {color: #FFF; background: #3A7C5E; background: linear-gradient(90deg, rgba(58, 124, 94, 1) 0%, rgba(0, 67, 36, 1) 100%);}
#contact .privacyPolicy {border: 1px solid #CCC; padding: 20px; height: 250px;}
#contact .privacyPolicy .inner {width: 100%; height: 100%; overflow-y: scroll; padding-right: 20px;}
