/*!
* Theme Name: 株式会社ゆうき 様
* Theme URI: 
* Author: 
* Author URI: 
* Description: 
* Version: 1.0
*/
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&family=Zen+Kaku+Gothic+New:wght@500;900&family=Material+Symbols+Outlined:wght@200&display=swap");
@import url(core.css);

html {font-family: "Poppins", "Zen Kaku Gothic New", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", verdana, Sans-Serif;}

.wp-note p, .wp-note ul, .wp-note ol{line-height: 180%;}
.wp-note table td, .wp-note table th, .wp-note table p, .wp-note table ul, .wp-note table ol{line-height: 150%;}
@media only screen and (max-width: 48.8125em){
	.wp-note p, .wp-note ul, .wp-note ol{line-height: 180%;}
}

body{letter-spacing: 0.05em;}
@media only screen and (max-width: 48.8125em){
body{letter-spacing: 0.05em;}
}

.container-half{max-width: 55%!important;}
.mainbody{/*margin-top: 100px;*/}

/**
 * Header
 */
.header{height: 8em; background-color: #faf5e3;}
.header .headernavi{position: relative; display: flex; align-items: center; justify-content: space-between; height: 100%; width: 100%; z-index: 10000; background-color: rgba(250, 245, 227, 0.85);}
.header .logo{display: block; margin-left: 2.5em;}
.header .logo img{height: 5em; width: auto;}
.header .headernavi.active{position: fixed; top: 0; left: 0; height: 5.5em; max-width: initial; background-color: rgba(250, 245, 227, 0.85);}
.header .headernavi.active .logo img{height: 4em;}
.header_menu ul{display: flex; gap: 2em;}
.header_menu .item{position: relative; display: block; font-weight: bold; padding: 0;}
.header_menu .item::after{position: absolute; top: .5em; left: 50%; content: ''; width: 10px; height: 10px; border-radius: 50%; background-color: #e54e0c; transform: translate(-50%, 0); z-index: 1; opacity: 0; transition: all .25s ease;}
.header_menu .item > a{position: relative; display: block; transition: color .25s ease; z-index: 2; padding: 1em 0;}
.header_menu .item .child{position: absolute; right: 0; top: 5em; display: block; width: 18.5em; z-index: 100; background-color: rgba(0, 94, 60, 0.85); padding: 1em; border-radius: 1em; visibility: hidden; opacity: 0; transition: all .25s ease;}
.header_menu .item .child_item{display: block; padding: .75em .5em;} 
.header_menu .item .child_item a{display: flex; color:#fff; align-items: center; gap: .75em; line-height: 125%; font-weight: normal; transition: color .25s ease;}
.header_menu .item .child_item a::before{display: inline-block; content: ''; min-width: 5px; min-height: 5px; background-color: #d0ff00;}
.header_menu .item:hover > a{color: #005e3c;}
.header_menu .item:hover::after{top: -.5em; opacity: 1;}
.header_menu .item:hover .child{visibility: initial; opacity: 1; top: 100%;}
.header_menu .item .child_item a:hover{color: #f4b733;}
.header .btn{margin-right: 2.5em;}
@media only screen and (max-width: 48.8125em){
	.header{height: 5em;}
	.header .logo{margin-left: 10px;}
	.header .logo img{height: 3em;}
	.header_menu{display: none;}
	.header .btn{display: none;}
}

.hamburger{position: absolute; top: 0; right: 0; width: 100px; height: 100%; z-index: 10000; display: none;}
.hamburger .wrapper{position: absolute; text-align: center; top: 50%; right: 10px; transform: translate(0, -50%); cursor: pointer; color: #fff;}
.hamburger .txt{margin-top: 0.75em; font-size: 80%; letter-spacing: 0.25em;}
.menu-trigger{position: relative; display: inline-block; width: 50px; height: 30px;}
.menu-trigger .burger{position: absolute; left: 0; background-color: #fff; width: 100%; height: 3px; transition: all .25s ease;}
.menu-trigger .burger:nth-child(1){top: 0;}
.menu-trigger .burger:nth-child(2){top: 50%; transform: translate(0, -50%); width: 75%;}
.menu-trigger .burger:nth-child(3){bottom: 0; width: 50%;}
.hamburger .wrapper.active{color: #333;}
.hamburger .wrapper.active .burger:nth-child(1){top: 50%; transform: translate(0, -50%) rotate(40deg); width: 100%; background-color: #005e3c;}
.hamburger .wrapper.active .burger:nth-child(2){opacity: 0;}
.hamburger .wrapper.active .burger:nth-child(3){top: 50%; transform: translate(0, -50%) rotate(-40deg); width: 100%; background-color: #005e3c;}
.hamburger .wrapper.active .txt{display: none;}

.header .headernavi.active .wrapper{color: #005e3c}
.header .headernavi.active .menu-trigger .burger{background-color: #005e3c;}
@media only screen and (max-width: 64em){
	.header .headernavi.active .hamburger{display: block;}
	.headernavi.active .header_menu{visibility: hidden;}
	.headernavi.active .btn{visibility: hidden;}
}
@media only screen and (max-width: 48.8125em){
	.header .headernavi.active{height: 5em;}
	.header .headernavi.active .logo img{height: 3em;}
	.hamburger{display: block;}
	.header .menu-trigger{width: 45px; height: 22px;}
	.header .menu-trigger .burger{background-color: #005e3c;}
	.header .hamburger .txt{color: #005e3c;}
}

.page-header{background-color: #faf5e3; padding-top: 1em; padding-bottom: 3em;}
.page-header .container{position: relative; display: flex; height: 15em; align-content: center; flex-wrap: wrap; z-index: 5;}
.page-header .page_header_s{display: block; width: 100%; font-size: 90%; color: #b1a479; margin-bottom: 1.5em;}
.page-header .page_header_t{display: inline-block; font-size: 250%; font-weight: bold; color: #005e3c; background-color: #fef740; padding: 0.25em 0;}
.page-header .page_header_i{position: absolute; top: 0; right: -15em; width: calc(50% + 15em); height: 100%; border-radius: 1em; z-index: 1;}
.page_header_deco-1{position: absolute; bottom: 0; left: 0; z-index: 2; width: 10.5em; height: auto;}
.page_header_deco-2{position: absolute; top: 0; right: 0; z-index: 10; width: 15em; height: auto;}

.pankuzu{padding: 0; font-size: 90%; background-color: #faf5e3;}
.pankuzu a{color: #eb6b0e;}
.pankuzu .line{position: relative; padding-left: 1.5em;}
.pankuzu .line::before{position: absolute; left: 0; top: 50%;  transform: translate(0, -50%); display: inline-block; content: "\e587"; font-family: "material symbols outlined"; font-size: 150%; font-weight: normal; color: #eb6b0e;}
@media only screen and (max-width: 48.8125em){
	.page-header{padding-top: 0; padding-bottom: 2em;}
	.page-header .container{height: 7.5em;}
	.page-header .page_header_s{font-size: 80%; margin-bottom: .75em;}
	.page-header .page_header_t{font-size: 125%;}
	.page-header .page_header_i{top: 0; right: -2em; width: 65%; border-top-left-radius: 1em; border-top-right-radius: 0; border-bottom-left-radius: 1em; border-bottom-right-radius: 0;}
	.page_header_deco-1{width: 3.5em;}
	.page_header_deco-2{top: initial; bottom: 0; width: 3.5em;}
}

/**
 * Sidebar
 */

/**
 * Footer
 */
.modal_confirm{position: fixed; left: 0; bottom: -100%; display: inline-flex; background-color: rgba(0, 0, 0, 0.75); padding: 2.5em; margin: 0 0 2em 2em; z-index: 10000; max-width: 700px; line-height: 175%; align-items: center; gap: 2em; transition: bottom 2s ease;}
.modal_confirm.active{bottom: 0;}
.modal_confirm .txt{color: #fff;}
.modal_confirm a{text-decoration: underline; color: inherit;}
.modal_confirm a:hover{text-decoration: none;}
.modal_confirm .agree{display: inline-flex; line-height: 200%; font-size: 90%; font-weight: bold; background-color: #fff; color: #333; padding: 0 2em; border-radius: 5em; white-space: nowrap; cursor: pointer;}
.modal_confirm .close{position: absolute; top: .75em; right: .75em; display: inline-block;}
.modal_confirm .close::before{display: inline-block; content: "\e5c9"; font-family: "material symbols outlined"; font-weight: normal; font-size: 175%; color: #fff; cursor: pointer;}
@media only screen and (max-width: 48.8125em){
	.modal_confirm{display: block; padding: 2.5em .5em 1.5em .5em; margin: 0; max-width: initial; line-height: 150%;}
	.modal_confirm .txt{font-size: 100%;}
	.modal_confirm .close{top: .5em; right: .5em;}
	.modal_confirm .btn{text-align: right; margin-top: .5em;}
}

.footer{position: relative; background-color: #faf5e3;}
.footer .hill{position: relative; background-image: url("./assets/images/tour-footer-background.png"); height: 10em; mask-image: url("./assets/images/tour-footer-hill.svg"); mask-repeat: no-repeat; mask-size: 100% auto; mask-position: right 0 bottom -1px; z-index: 2}
.footer .tree{position: absolute; left: 2em; top: 0; z-index: 15; width: auto; height: 10em;}
.footer_wrapper{background-image: url("./assets/images/tour-footer-background.png"); padding-bottom: 12.5em;}
.footer_wrapper .container{display: flex; justify-content: space-between;}
.footer_wrapper .logo{display: inline-block; margin-bottom: 2em;}
.footer_wrapper .logo img{filter: brightness(0) invert(1); width: 15em;}
.footer_wrapper-l{color: #fff;}
.footer_wrapper-l .addr{margin-bottom: 0.5em;}
.footer_wrapper-l .tel span{font-size: 125%;}
.footer_wrapper-r .footer_navi{display: flex; gap: 1.5em; align-items: center; list-style: none; margin-bottom: 2.5em;}
.footer_wrapper-r .footer_sns{display: flex; align-items: center; justify-content: flex-end;}
.footer_wrapper-r .footer_sns .policy{font-size: 85%; margin-right: 1.5em;}
.footer_wrapper-r .footer_sns .sns{display: flex; gap: 1em;}
.footer_wrapper-r img{width: 2.5em; height: auto;}
.footer_wrapper-r .link{color: #fff; text-decoration: none; transition: color 1.25s ease;}
.footer_wrapper-r .link:hover{color: #1eeb0e;}
.footer .copyright{text-align: center; font-size: 90%; color: #fff; margin-top: 5em;}

@media only screen and (max-width: 48.8125em){
	.footer .hill{height: 3.5em;}
	.footer .tree{height: 3.5em;}
	.footer_wrapper .container{display: block;}
	.footer_wrapper .logo img{width: 10em;}
	.footer_wrapper-l{text-align: center;}
	.footer_wrapper-r{margin-top: 3em; justify-content: center;}
	.footer_wrapper-r img{width: 2em;}
	.footer_wrapper-r .footer_navi{display: grid; grid-template-columns: 1fr 1fr; text-align: center; gap: .75em;}
	.footer_wrapper-r .footer_sns{display: block; text-align: center;}
	.footer_wrapper-r .footer_sns .sns{justify-content: center; margin-top: 1.5em;}
}

.movetop{position: fixed; right: -150px; bottom: 1em; display: block; transition: right .5s ease; z-index: 1500;}
.movetop.active{right: 20px;}
.movetop .btn{position: relative; display: inline-flex; align-items: center; justify-content: center; width: 5em; height: 5em; border: 3px #02b939 solid; border-radius: 50%; flex-wrap: wrap; transition: background-color .25s ease;}
.movetop .btn::before{display: inline-block; content: "\e5d8"; font-family: "material symbols outlined"; font-size: 280%; font-weight: bold; color: #02b939; padding-bottom: .25em; transition: color .25s ease;}
.movetop .btn::after{position: absolute; bottom: .75em; left: 50%; transform: translate(-50%, 0); display: inline-block; content: 'TOP'; font-size: 75%; color: #02b939; transition: color .25s ease;}
.movetop .btn:hover{background-color: #02b939;}
.movetop .btn:hover::after, .movetop .btn:hover::before{color: #fff;}
@media only screen and (max-width: 48.8125em){
	.movetop .btn{width: 3.5em; height: 3.5em; border: 2px #02b939 solid;}
	.movetop .btn::before{font-size: 200%; padding-bottom: .5em;}
}

.mobile-navi-down{position: fixed; top: 0; right: 0; visibility: hidden; width:100%; height: 100%; background-color: #fff; opacity: 0; transition: all .5s; z-index:-100; padding-top: 6em;}
.mobile-navi-down.active{visibility: visible; opacity: 1; z-index:3000;}
.mobile-navi-down .mobile-navi-box{max-height: 100%; padding: 0 1em 5em 1em;}
.mobile-navi-down .mobile-navi-menu ul{display: block; list-style: none;}
.mobile-navi-down .mobile-navi-menu .item{font-size: 1.25rem; line-height: 125%; padding: .75em 0;}
.mobile-navi-down .mobile-navi-menu .item > a{display: flex; font-weight: bold; color:#005e3c; align-items: center;}
.mobile-navi-down .mobile-navi-menu .item > a::before{display: inline-block; content: ''; width: 8px; height: 8px; border-radius: 50%; background-color: #eb6b0e; margin-right: .5em;}
.mobile-navi-down .mobile-navi-menu .child_item{padding: 1.25em 0 0 1em;} 
.mobile-navi-down .mobile-navi-menu .child_item > a{display: flex; align-items: center; font-weight: bold;}
.mobile-navi-down .mobile-navi-menu .child_item > a::before{display: inline-block; content: ''; height: 3px; width: 8px; background-color: #eb6b0e; margin-right: .5em;}
.mobile-navi-down .btn{text-align: center; margin-top: 2.5em;}

/**
 * Home
 */
.top-impact {position: relative; background-color: #faf5e3; margin-bottom: -6em;}
.top-impact .top-impact_box{position: relative;}
.top-impact .swiper-container{overflow: hidden; border-radius: 3em; width: 100%; height: 70vh; max-height: 50em; min-height: 35em; z-index: 10;}
.top-impact .swiper-slide img{transition: transform 5s linear; transform: scale(1.2);}
.top-impact .swiper-slide-active img, .top-impact .swiper-slide-duplicate-active img, .top-impact .swiper-slide-prev img{transform: scale(1);}
.top-impact .deco-1{position: absolute; bottom: 0; left: 0; z-index: 20; width: 20vw; height: auto; min-width: 15em; max-width: 20em;}
.top-impact .deco-2{position: absolute; top: 0; right: 0; z-index: 20;  width: 20vw; height: auto; min-width: 15em; max-width: 20em;}
.top-impact .readcopy{position: absolute; top:2.5em; left: 1em; display: block; font-size: 250%; font-weight: bold; color: #005e3c; z-index: 30;}
.top-impact .readcopy span.block-reveal_box{display: inline-block; margin-bottom: .2em; background-color: rgba(232, 231, 42, .85); padding: .15em;}
.top-impact .works{position: absolute; bottom: 3em; right: 3em; z-index: 30; text-align: center;}
.top-impact .works .wrapper{display: flex; gap: 0.5em;}
.top-impact .works .title{font-weight: bold; font-size: 120%; color: #fff; -webkit-text-stroke: 0.3em #005e3c; paint-order: stroke; margin-bottom: 0.75em;}
.top-impact .works .btn{position: relative; display: block; background-color: initial; width: 8em; height: 8em; border-radius: 50%; border: 3px #005e3c solid; z-index: 5; overflow: hidden;}
.top-impact .works .btn::before{position: absolute; top:0; left: 0; display: inline-block; content: ''; width: 100%; height: 100%; background-color: #fff; z-index: 1;}
.top-impact .works .btn::after{position: absolute; top: 50%; left: 50%; display: inline-block; content: ''; width: 0%; height: 0%; background-color: #d0ff00; transform: translate(-50%, -50%); z-index: 2; border-radius: 50%; transition: all .25s ease;}
.top-impact .works .btn .ico{position: absolute; width: 65%; height: auto; left: 50%; top: 50%; transform: translate(-50%, -65%); z-index: 6;}
.top-impact .works .btn span{position: absolute; display: inline-block; left: 50%; bottom: 0.75em; font-size: 100%; font-weight: bold; transform: translate(-50%, 0); color: #005e3c; z-index: 7;}
.top-impact .works .btn:hover::after{width: 100%; height: 100%;}
@media only screen and (max-width: 48.8125em){
	.top-impact .swiper-container{max-height: initial;}
	.top-impact .readcopy{font-size: 5vw;}
	.top-impact .deco-1{width: 20vw; min-width: initial; max-width: initial;}
	.top-impact .deco-2{width: 20vw; min-width: initial; max-width: initial;}
	.top-impact .works{bottom: 3em; left: 50%; right: initial; transform: translate(-50%, 0);}
	.top-impact .works .btn{width: 6.5em; height: 6.5em;}
	.top-impact .works .btn span{font-size: 85%};
}

.top-news-sep-1{position: relative; background-color: #faf5e3; overflow: visible;}
.top-news-sep-1 .hill{background-image: url("./assets/images/background-wall-2.png"); mask-image: url("./assets/images/tour-sep-hill-2.svg"); mask-repeat: no-repeat; mask-size: calc(100% + 1rem) auto; mask-position: left -0.75rem bottom 0; width: 100%; height: 6vw; min-height: 110px;}
.top-news-sep-2{position: relative; background-color: #faf5e3; overflow: visible;}
.top-news-sep-2 .hill{background-image: url("./assets/images/background-wall-2.png"); mask-image: url("./assets/images/tour-sep-hill-1.svg"); mask-repeat: no-repeat; mask-size: calc(100% + 1rem) auto; mask-position: left -0.75rem top 0; width: 100%; height: 6vw; min-height: 110px;}
.top-news{background-image: url("./assets/images/background-wall-2.png");}
.top-news .header-box{display: flex; align-items: center; margin-bottom: 1.5em; gap: 2em;}
.top-news .top-title-1{margin-bottom: 0;}
.list-grid{display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 1.5em;}
.list-grid .item{display: block;}
.list-grid .item .thumb{height: 12.5em; border-radius: 1em; overflow: hidden; box-shadow: #fff 0.5em 0.5em 0; margin-bottom: 1em; transition: box-shadow .5s ease;}
.list-grid .item .thumb img{transition: transform .5s ease;}
.list-grid .item .title{font-weight: bold; line-height: 150%; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; margin-bottom: .5em; transition: color .5s ease;}
.list-grid .item .summary{display: flex; justify-content: space-between; align-items: center; font-size: 90%;}
.list-grid .item .summary .date{color: #666;}
.list-grid .item .summary .tag{color: yellow;}
.list-grid .item:hover .thumb{box-shadow: #fff 0 0 0;}
.list-grid .item:hover .thumb img{transform: scale(1.25);}
.list-grid .item:hover .title{color: #005e3c;}
@media only screen and (max-width: 48.8125em){
	.top-news-sep-1 .hill{height: 3.5em; min-height: initial;}
	.top-news-sep-2 .hill{height: 3.5em; min-height: initial;}
	.top-news .header-box{display: block; text-align: center;}
	.top-news .header-box .tags{margin: .75em 0 .75em 0;}
	.list-grid{grid-template-columns: 1fr 1fr; gap: .75em;}
	.list-grid .item .thumb{height: 30vw; border-radius: .5em; box-shadow: #fff 0.25em 0.25em 0; margin-bottom: .75em;}
	.list-grid .item .title{-webkit-line-clamp: 3;}
}

.top-work{background-color: #faf5e3;}
.top-work .viewport_wrapper{position: relative;}
.top-work .catch{position: absolute; left: 0; top: 0; width: calc(50vw + 1.5em); height: 100%; min-width: 38.75rem; border-top-right-radius: 3em; border-bottom-right-radius: 3em;}
.top-work .deco{position: absolute; right: 0; top: 0;}
.top-work .container{position: relative; display: flex; justify-content: flex-end; align-items: center; z-index: 10; height: 35em; line-height: 200%;}
.top-work .container_box{width:calc(50% - 6em);}
.top-work .header-wrap .sub{font-size: 80%; font-weight: bold; color: #b1a479; margin-bottom: 1em;}
.top-work .header-wrap .title{display: inline-flex; font-size: 250%; font-weight: bold; color: #005e3c; background: linear-gradient(transparent 50%, yellow 50%); margin-bottom: 1.5em;}
.top-work .txt{margin-bottom: 2.5em;}
.top-work.right .catch{left: initial; right: 0; border-top-left-radius: 3em; border-bottom-left-radius: 3em; border-top-right-radius: 0; border-bottom-right-radius: 0;}
.top-work.right .container{justify-content: flex-start;}
.top-work.right .deco{right: initial; left: 0;}
@media only screen and (max-width: 48.8125em){
	.top-work .viewport_wrapper{display: flex; flex-wrap: wrap;}
	.top-work .catch{position: relative; border-radius: 0!important; width: 100%; min-width: initial; height: 45vw; order:1;}
	.top-work .container{position: relative; height: initial; order:2; text-align: center; background-color: #faf5e3; margin-top: -2em; padding-top: 1em;}
	.top-work .deco{right: initial; left: 0; width: 55vw; height: auto;}
	.top-work .container_box{width: 100%;}
	.top-work .header-wrap .sub{margin-bottom: 0em;}
	.top-work .header-wrap .title{font-size: 150%; margin-bottom: .5em;}
}

.top-store{background-color: #faf5e3; background-image: url(./assets/images/background-wall-1.png); background-repeat: repeat;}
.top-store .top-title-1{text-align: center;}
.top-store .summary{color: #fff; line-height: 200%; margin-bottom: 2.5em; text-align: center;}
.top-store .btn{text-align: center;}
.top-store-sep-1{position: relative; background-color: #faf5e3; overflow: visible; z-index: 10;}
.top-store-sep-1 .hill{background-image: url("./assets/images/background-wall-1.png"); mask-image: url("./assets/images/tour-sep-hill-2.svg"); mask-repeat: no-repeat; mask-size: calc(100% + 1rem) auto; mask-position: left -0.75rem bottom 0; width: 100%; height: 6vw; min-height: 110px;}
.top-store-sep-1 .deco-1{position: absolute; top:0; left: 2em; width: 35vw; height: auto;}
.top-store-sep-1 .deco-2{position: absolute; bottom: 0; right: 2em; width: 10vw; height: auto;}
.top-store-sep-2{background-color: #faf5e3; margin-top: -2px; overflow: visible;}
.top-store-sep-2 .hill{background-image: url("./assets/images/background-wall-1.png"); mask-image: url("./assets/images/tour-sep-hill-1.svg"); mask-repeat: no-repeat; mask-size: calc(100% + 1rem) auto; mask-position: left -0.75rem top 0; width: 100%; height: 6vw; min-height: 110px;}
.top-store-sep-2 .deco-3{position: absolute; bottom: 1em; left: 50%; transform: translate(calc(40vw - 50%), 0); width: 10em; height: auto;}
@media only screen and (max-width: 48.8125em){
	.top-store-sep-1 .hill{height: 7vw; min-height: initial;}
	.top-store-sep-2 .hill{height: 7vw; min-height: initial;}
	.top-store-sep-2 .deco-3{bottom: 1em; left: initial; right: 3em; transform: initial; width: 15vw;}
}

.top-instagram{background-color: #faf5e3; padding-top: 0!important;}
.top-instagram .section-title{text-align: center;}
.top-instagram .ico{filter: brightness(0) saturate(100%) invert(54%) sepia(38%) saturate(391%) hue-rotate(8deg) brightness(90%) contrast(89%); width: 2em; height: auto; padding-bottom: .5em;}
.top-instagram .swiper-slide{width: 12.5em; height: 12.5em; overflow: hidden; margin: 0 0.25em;}
.top-instagram .swiper-slide a{display: block; width: 100%; height: 100%;}
.top-instagram .swiper-wrapper{transition-timing-function: linear!important;}
@media only screen and (max-width: 48.8125em){
	.top-instagram .swiper-slide{width: 8em; height: 8em;}
}

.top-title-1{color: #958655; font-weight: bold; font-size: 250%; margin-bottom: 2.5rem; line-height: 120%;}
.top-title-1.white{color: #fff;}
.top-title-1.blue{color: #4299af;}
.top-title-1.green{color: #005e3c;}
.top-title-2{color: #958655; font-weight: bold; font-size: 150%; margin-bottom: 2.5rem; line-height: 120%; text-align: center;}
@media only screen and (max-width: 48.8125em){
	.top-title-1{font-size: 150%; margin-bottom: 1.5rem;}
	.top-title-2{font-size: 125%; margin-bottom: 1.5rem;}
}

/**
 * Content
 */
.page-viewport{background-color: #faf5e3;}
.wp-note h1{font-size: 250%; font-weight: bold; color: #005e3c; margin-bottom: .25em; line-height: 115%;}
.wp-note h2{display: flex; font-size: 175%; font-weight: bold; align-items: center; line-height: 125%; margin-top: 2em; margin-bottom: 1em;}
.wp-note h2::before{display: inline-block; content: ''; width: 10px; min-width: 10px; height: 10px; background-color: #fef740; border: 2px #005e3c solid; border-radius: 50%; margin-right: .35em;}
.wp-note h3{font-size: 125%; color: #005e3c; line-height: 125%; margin-top: 2em; margin-bottom: 1.25em;}
.wp-note .t1{border: none; border-top: 1px #dedbd0 solid;}
.wp-note .t1 th, .wp-note .t1 td{border: none; border-bottom: 1px #dedbd0 solid; padding: 1em .5em;}
.wp-note .t1 th{font-weight: bold; color: #4e3c00;}

.single-header{margin-bottom: 2em; border-bottom: 1px #daca92 solid; padding-bottom: 2em;}
.single-header .info{display: flex; align-items: center; justify-content: space-between;}
.single-header .info .date{font-size: 90%; color: #666;}
.single-header .info .category{font-size: 90%; color: #4e3c00;}
.single-footer{margin-top: 5em; text-align: center;}

.archive-page{background-color: #faf5e3;}
.archive-title{display: flex; margin-bottom: 2em; align-items: center;}
.archive-title span{color: #005e3c; font-size: 125%;}
.archive-title .page{display: inline-block; margin-left: 1.5em; color: #888; font-size: 90%;}
.archive-page .pagenation{display: grid; grid-template-columns: 1fr 1fr; margin-top: 3em; margin-bottom: 3em; align-items: center;}
.archive-page .pagenation .prev{text-align: left;}
.archive-page .pagenation .next{text-align: right;}
.archive-page .pagenation a{display: inline-flex; align-items: center; font-size: 90%; font-weight: bold; color: #eb6b0e;}
.archive-page .pagenation .prev a::before{display: inline-block; content: "\eac3"; font-family: "material symbols outlined"; font-size: 200%; font-weight: normal;}
.archive-page .pagenation .next a::after{display: inline-block; content: "\eac9"; font-family: "material symbols outlined"; font-size: 200%; font-weight: normal;}

.column-list .item{display: flex; align-items: center; padding-bottom: 2em; gap: 3.5em;}
.column-list .item .summary{width: 100%;}
.column-list .item .thumb{width: 20em; height: 12.5em; border-radius: 1em; overflow: hidden;}
.column-list .item .thumb img{transition: opacity .25s ease;}
.column-list .item .title{font-size: 175%; line-height: 125%; font-weight: bold; color: #005e3c; transition: color .25s ease;}
.column-list .item .info{display: flex; align-items: center; justify-content: space-between; margin-top: 1em;}
.column-list .item .info .date{font-size: 90%; color: #666;}
.column-list .item .info .category{font-size: 90%; color: #4e3c00;}
.column-list .item:hover .thumb img{opacity: .75;}
.column-list .item:hover .title{color:#02b939;}

.archive-selector .title{font-size: 90%; margin-bottom: 0.5em;}
.archive-selector .item{margin-bottom: 2em;}
.archive-selector .selectbox {position: relative; width: 100%;}
.archive-selector select{-webkit-appearance: none; appearance: none; width: 100%; padding: 1em 0.5em; box-sizing: border-box; font-size: 95%; background:#ebe1bc; outline: 2px #ebe1bc solid; border: none; border-radius: 5px; }
.archive-selector .selectbox::after{position: absolute; right: 1.25em; top: 35%; display:block; width: 0.5em; height: 0.5em; content:"";  border-bottom:#4e3c00 2px solid; border-right:#4e3c00 2px solid; transform:rotate(45deg)translateY(-30%);}
.archive-selector select:focus{outline: 2px #4e3c00 solid;}

.page-child-menu{position: relative; margin-top: 8em; background-color: #ecebda; border-radius: 2em; padding: 2.5em;}
.page-child-menu .menu-title{position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%); font-weight: bold; white-space: nowrap;}
.page-child-menu .menu-title::before{display: inline-block; width: 2px; height: 1em; content: ''; background-color: #4e3c00; transform: rotate(-45deg); margin-right: 0.5em;}
.page-child-menu .menu-title::after{display: inline-block; width: 2px; height: 1em; content: ''; background-color: #4e3c00; transform: rotate(45deg); margin-left: 0.5em;}
.page-child-menu .menu-title span{font-size: 150%; color: #005e3c;}
.page-child-menu_list{display: flex; flex-wrap: wrap; align-items: center; justify-content: center; list-style: none; column-gap: 2em; row-gap: 1.5em;}
.page-child-menu_list .item{list-style: none;}
.page-child-menu_list a{display: inline-flex; align-items: center; justify-content: center; padding: .75em 1.25em; border-radius: 5em; border:1px #005e3c solid; color: #005e3c; min-width: 15em; transition: color .25s ease, background-color .25s ease;}
.page-child-menu_list a:hover{color: #fff; background-color: #005e3c;}

.page-thumb-child-menu{margin-top: 3.5em;}
.page-thumb-child-menu_list{display: grid; grid-template-columns: 1fr 1fr; gap: 2.5em; padding: 0!important;}
.page-thumb-child-menu_list .item{list-style: none; height: 100%;}
.page-thumb-child-menu_list .item a{display: block; border-radius: 1em; overflow: hidden; height: 100%;}
.page-thumb-child-menu_list .item .thumb{height: 12.5em;}
.page-thumb-child-menu_list .item .title{font-size: 175%; font-weight: bold; color: #005e3c; line-height: 125%; text-align: center; padding-bottom: 0em; margin-bottom: 0.5em;}
.page-thumb-child-menu_list .item .summary{background-color: #ecebda; padding: 1.75em;}

@media only screen and (max-width: 48.8125em){
	.wp-note h1{font-size: 150%; margin-bottom: .25em; line-height: 125%;}
	.wp-note h2{font-size: 125%; line-height: 135%;}
	.wp-note h2::before{width: 5px; min-width: 5px; height: 5px;}
	.wp-note h3{font-size: 110%; line-height: 150%;}
	.single-header{margin-bottom: 1.5em; padding-bottom: 1.5em;}

	.column-list .item{padding-bottom: 2.5em; gap: .75em; align-items: flex-start;}
	.column-list .item .thumb{width: 30vw; height: 18vw;}
	.column-list .item .title{font-size: 100%;}

	.page-child-menu{border-radius: 1em; padding: 1.5em 1em;}
	.page-child-menu .menu-title span{font-size: 125%;}
	.page-child-menu_list{column-gap: 1em; row-gap: .75em;}
	.page-child-menu_list a{padding: .5em .75em;}

	.page-thumb-child-menu_list{grid-template-columns: 1fr; gap: 1.5em;}
	.page-thumb-child-menu_list .item .title{font-size: 125%;}
}


 /**
 * Common
 */
.btn-circle{position: relative; display: inline-flex; align-items: center; color: #fff; font-weight: bold; background-color: #eb6b0e;  font-size: 120%; border-radius: 5em; line-height: 120%; padding: 1em 3em; transition: background-color .25s ease;}
.btn-circle.allow::after{position: absolute; top: 50%; right: .75em; display: inline-flex; justify-content: center; align-items: center; content: "\e315"; font-family: "material symbols outlined"; background-color: #fff; color: #eb6b0e; border-radius: 50%; transform: translate(0, -50%); overflow: hidden; width: 1.25em; height: 1.25em; text-indent:.15em;}
.btn-circle:hover{background-color: #e3af12;}
.btn-circle.allow:hover::after{animation:btn-icon-indent .5s ease;}
.btn-circle.small{font-size: 100%; padding: .75em 2.5em; }
.btn-circle.green{background-color: #005e3c;}
.btn-circle.green.allow::after{color: #005e3c;}
.btn-circle.green:hover{background-color: #02b939;}
.btn-circle.orange{background-color: #e54e0c;}
.btn-circle.orange.allow::after{color: #e54e0c;}
.btn-circle.orange:hover{background-color: #fb8b1e;}
.btn-circle_outline{position: relative; display: inline-flex; align-items: center; font-weight: bold; color: #005e3c; border: 2px #005e3c solid; border-radius: 5em; padding: 1em 1.25em; transition: background-color .25s ease;}
.btn-circle_outline:hover{background-color: #005e3c; color: #fff;}
.btn-circle_outline.back::before{display: inline-block; content: "\e166"; font-family: "material symbols outlined"; font-size: 175%; padding-right: 0.25em;}

.btn-tag{display: inline-flex; font-size: 90%; padding: .5em 1.25em; background-color: #fff; color: #005e3c; border-radius: 1.5em; transition: color .5s ease, background-color .5s ease; margin: 0 .25em;}
.btn-tag:hover{background-color: #005e3c; color: #fff;}

@keyframes btn-icon-indent{
0% {text-indent:.15;}
50% {text-indent:1.25em;}
50.01% {text-indent:-1.25em;}
100% {text-indent:.15;}
}

