@charset "utf-8";

/* common */

* {
box-sizing: border-box;
}
body {
color:#242424;
margin: 0;
padding: 0;
text-align: center;
-webkit-text-size-adjust: 100%;
position: relative;
}
body {
font-family: "游ゴシック","Noto Sans JP","Yu Gothic", "游ゴシック体", YuGothic, sans-serif;
}
body,html {
height: 100%;
font-size:10px;
}
a {
outline: none;
text-decoration: none;
}
a img {
text-decoration: none;
border: none;
}
area {
border:none;
outline: none;
}
h1,h2,h3,h4,h5,h6 {
display: block;
margin: 0px;
padding: 0px;
}
p,ul,ol,dl,dt,dd,figure {
margin: 0px;
padding: 0px;
}
ul,ol {
list-style-type: none;
}
ol {
list-style-position: inside;
}
em {
font-style: normal;
color:#930;
}
dt,dd {
margin: 0;
}
input[type="text"],
input[type="email"],
input[type="tel"],
textarea,
select {
border:1px solid #9C0;
padding: 5px;
font-family: "游ゴシック","Noto Sans JP","Yu Gothic", "游ゴシック体", YuGothic, sans-serif;
font-size:15px;
}
input[type="text"],
input[type="email"],
input[type="tel"],
textarea {
width:20em!important;
}
textarea {
line-height: 1.3;
height:calc(1.3em * 4 + 10px)!important;
}
@media screen and (max-width:1023px){
.read,section {
line-height: 160%;
}
}

/* pc・sp */

@media screen and (max-width:1023px){
.pc {
display: none!important;
}
}
@media screen and (min-width:1024px){
.sp {
display: none!important;
}
}

/* images */

.photo img {
width: 100%;
height: auto;
box-shadow: 2px 2px 2px rgba(0,0,0,0.4);
border:3px solid #FFF;
}

/* link button */

.button {
outline: none;
border: none;
cursor: pointer;
}

/* alterna */

.alterna {
text-indent: -9999px;
}


/* TreeL TreeR */

.tree {
width: 340px;
height: 300px;
position: absolute;
overflow: hidden;
top:0;
z-index: 1;
}
.tree.left {
left:0;
}
.tree.right {
right:0;
}
#TreeL,
#TreeR {
display: block;
width: 100%;
height: 100%;
position: absolute;
left: 0;
right: 0;
}
#TreeL {
background: url("images/back-main.png")right center/auto 100% no-repeat;
}
#TreeR {
background: url("images/back-main.png")left center/auto 100% no-repeat;
}
.tree > span {
display: block;
width: 16.5%;
height: 18.7%;
position: absolute;
transform-origin: top center 0;
animation: fruit00 2s ease infinite;
}
#Big {
width: 26.5%;
height: 30%;
}
.tree > span span {
display: block;
position: absolute;
}
.tree > span .image {
width: 0;
height: 0;
background: url("images/img_fruit-yellow.png")center center/auto 100% no-repeat;
left:50%;
top:50%;
transform: translate(-50%,-50%);
animation: fruit01 1s ease forwards;
}
#Big .image {
cursor: pointer;
}
#Big .text {
display: block;
font-size: 1.3rem;
color:#FFF;
font-weight: 600;
padding: .2em .7em;
border-radius: 1em;
background: #FF9900;
right:0;
bottom:-32%;
opacity: 0;
animation: fruit02 1s ease forwards;
animation-delay: 3s;
}
#Big .text::before {
content:"";
display: block;
width: 0;
height: 0;
position: absolute;
border-bottom: 12px solid #F90;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
top:-12px;
left:50%;
transform: translateX(-50%);
}
#TreeL.pink,
#TreeR.pink {
filter: hue-rotate(-100deg) opacity(90%);
}
#TreeL.blue,
#TreeR.blue {
filter: hue-rotate(100deg) opacity(80%);
}
@media screen and (max-width:479px){
.tree {
width: 180px;
height: 160px;
}
.tree.left > span:nth-of-type(5),
.tree.right > span:nth-of-type(4) {
display: none;
}
#Big .text {
right:-10%;
bottom:-80%;
}
}
@media screen and (min-width:480px) and (max-width:1023px){
.tree {
width: 220px;
height: 215px;
}
}
/* fruits */

#TreeL.pink ~ span .image,
#TreeR.pink ~ span .image {
background: url("images/img_fruit-pink.png")center center/auto 100% no-repeat;
}
#TreeL.blue ~ span .image,
#TreeR.blue ~ span .image {
background: url("images/img_fruit-blue.png")center center/auto 100% no-repeat;
}


/* fruit anime */

@keyframes fruit00 {
0%{transform: rotate(-10deg);}
50%{transform: rotate(10deg);}
100%{transform: rotate(-10deg);}
}
@-webkit-keyframes fruit00 {
0%{transform: rotate(-10deg);}
50%{transform: rotate(10deg);}
100%{transform: rotate(-10deg);}
}
@keyframes fruit01 {
0%{width: 0;height: 0;}
30%{width: 0;height: 0;}
100%{width: 100%;height: 100%;}
}
@-webkit-keyframes fruit01 {
0%{width: 0;height: 0;}
30%{width: 0;height: 0;}
100%{width: 100%;height: 100%;}
}
@keyframes fruit02 {
0%{display: none;opacity: 0;}
30%{display: inline-block;opacity: 0;}
100%{display: inline-block;opacity: 1;}
}
@-webkit-keyframes fruit02 {
0%{display: none;opacity: 0;}
30%{display: inline-block;opacity: 0;}
100%{display: inline-block;opacity: 1;}
}

/* fruit position left */

.tree.left > span:nth-of-type(1){
left: 3%;
top:15%;
}
.tree.left > span:nth-of-type(2){
left:4%;
top:59%;
}
.tree.left > span:nth-of-type(3){
left:32%;
top:3%;
}
.tree.left > span:nth-of-type(4){
left:35%;
top:38%;
}
.tree.left > span:nth-of-type(5){
left:70%;
top:5%;
}

/* fruit position right */

.tree.right > span:nth-of-type(1){
right: 69%;
top:5%;
}
.tree.right > span:nth-of-type(2){
right:35%;
top:39%;
}
.tree.right > span:nth-of-type(3){
right: -4%;
top: 36%;
}
.tree.right > span:nth-of-type(4){
right:23%;
top:10%;
}
.tree.right > span:nth-of-type(5){
right:2%;
top:65%;
}

/* fruit anime delay */

.tree > span:nth-of-type(2),
.tree > span:nth-of-type(2) .image {
animation-delay: 1s;
}
.tree > span:nth-of-type(3),
.tree > span:nth-of-type(3) .image {
animation-delay: 1.5s;
}
.tree > span:nth-of-type(4),
.tree > span:nth-of-type(4) .image {
animation-delay: 2s;
}
.tree > span:nth-of-type(5),
.tree > span:nth-of-type(5) .image {
animation-delay: 0.5s;
}


/* header */

@media screen and (max-width:1023px){
header {
height: 100%;
position: relative;
margin: 0 0 2em ;
}
header::after {
content:"";
display: block;
position: absolute;
width: 88px;
height: 30px;
background: url("images/arrow02.png")center center/auto 30px no-repeat;
bottom:10px;
left:50%;
transform: translateX(-50%);
}
}
@media screen and (min-width:1024px){
header,
main {
width: 1000px;
margin: 0 auto;
}
header {
padding: 45px 0 0 0;
}
}

/* header h1 */

@media screen and (max-width:1023px){
header h1 {
width: 100%;
height: 180px;
background: url("images/img_h1-sp.jpg")center center/auto 180px no-repeat;
position: absolute;
top:50%;
transform: translateY(-50%);
}
}
@media screen and (min-width:1024px){
header h1 {
height: 242px;
background: url("images/img_h1-pc.jpg")center center/auto 242px no-repeat;
}
}

/* Global*/

#Global {
z-index: 9999;
}
#Global .menu {
font-size: 1.6rem;
}
#Global .menu a {
display: block;
color:#006633;
font-weight: 600;
}
@media screen and (max-width:1023px){
#Global {
width: 0;
height: 0;
overflow: hidden;
background: rgba(0,0,0,0.8);
position: fixed;
transition: .5s ease;
}
#Global.appear {
width: 102%;
height: 102%;
}
#Global .menu {
width: 0;
height: 0;
opacity: 0;
overflow: hidden;
position:absolute;
}
#Global.appear .menu {
animation: appear03 .5s ease forwards;
animation-delay: .3s;
}
#Global,
#Global .menu {
top:50%;
left: 50%;
transform: translate(-50%,-50%);
}
@keyframes appear03 {
0% {width: 0;height: 0;opacity: 0;overflow: hidden;}
70% {width: 0;height: 0;opacity: 0;overflow: hidden;}
100% {width: 90%;height: auto;opacity: 1;overflow: visible;}
}
#Global .menu li {
padding: 0 1em;
margin: 0 0 .4em 0;
}
#Global .menu li a {
padding: 0.7em 1em;
background: #FFFFB9;
border-radius: 1.8em;
white-space: nowrap;
}
#Global .menu li a::before {
content:"";
display: inline-block;
width: 1em;
height: 1em;
background: url(images/point01.png)center center/1em auto no-repeat;;
margin: 0 .4em 0 0;
vertical-align: middle;
}

/* SP menu button */

#Global + .menu-btn {
display: block;
width: 55px;
height: 55px;
font-size: 1.3rem;
font-weight: 600;
position: fixed;
top:10px;
right: 10px;
z-index: 9999999;
}
#Global + .menu-btn .button {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
background: #477A00;
color:#FFF;
border-radius: 60%;
transition: 0.5s ease;
}
#Global.appear + .menu-btn .button {
color:#477A00;
background: #FFF;
}
#Global + .menu-btn > span::before{
content:"menu";
}
#Global.appear + .menu-btn > span::before{
content:"close";
}
}
@media screen and (min-width:480px) and (max-width:1023px){
#Global.appear .menu {
max-width: 80vw;
}
}
/***/
@media screen and (min-width:1024px){
#Global {
padding: 30px 0 70px 0;
position: relative;
}
#Global .menu {
background: #FFFFB9;
border-radius: 8px;
box-shadow: 0 3px 3px #CCC;
display: inline-block;
}
#Global .menu li {
display: inline-block;
padding: 1rem 0 0;
}
#Global .menu li::after {
content:"";
display: block;
width: 0;
height: 5px;
margin: 0 auto;
border-bottom: 5px solid #FFFFB9;
transition: .5s ease;
}
#Global .menu li:hover::after,
#Global .menu li.select::after{
width: 70%;
border-bottom: 5px solid #FFCC00;
}
#Global .menu a {
padding: .3em 1.5em;
border-right: 1px solid #99CC00;
transition: .5s ease;
}
#Global .menu li:last-of-type a {
border-right: none;
}
#Global .menu a:hover {
color:#FF9900;
}
}

/* enquiry nav, UpBtn */

.sidebtn {
font-size: 1.4rem;
position: fixed;
z-index: 99999;
transition: 1s ease;
}
.enquiry.nav {
top: 25%;
}
#UpBtn {
bottom:-100%;
}
.sidebtn.appear {
right: 10px;
}
.sidebtn .button {
display: block;
color:#FFF;
transition: 0.5s ease;
}
.enquiry.nav .button {
padding: 2.5em 0 1em 0;
background: url("images/mail.svg")top 24% center/auto 21% no-repeat #477A00;
}
.enquiry.nav .button:hover {
color:#FFC;
background: url("images/mail.svg")top 24% center/auto 26% no-repeat #2D5A00;
}
@media screen and (max-width:1023px){
#UpBtn,
#UpBtn.appear {
right: 10px;
bottom:10px;
}
.sidebtn .button {
width: 55px;
height: 55px;
border-radius: 30px;
}
#UpBtn .button {
background: url("images/arrow01.svg")center center/auto 25px no-repeat #477A00;
}
}
@media screen and (min-width:1024px){
.sidebtn {
right: -100%;
}
#UpBtn {
bottom:-100%;
}
#UpBtn.appear {
bottom:10%;
}
.sidebtn .button {
width: 70px;
height: 70px;
border-radius: 40px;
}
#UpBtn .button {
background: url("images/arrow01.svg")center center/auto 30px no-repeat #477A00;
}
#UpBtn .button:hover {
color:#FFC;
background: url("images/arrow01.svg")center center/auto 30px no-repeat #2D5A00;
}
}

/* article */

article {
font-size: 1.5rem;
text-align: left;
overflow: hidden;
}
.yellow {
background: #FFFFD7;
margin: 0 0 10em 0;
transition: 1.2s ease;
}
.yellow.pink {
background: #FFF0F0;
}
.yellow.blue {
background: #EAF5FA;
}
@media screen and (max-width:1023px){
.yellow {
padding: 15px 3% 50px 3%;
}
}
@media screen and (min-width:1024px){
.yellow {
padding: 15px 8% 50px 8%;
border-radius: 20px;
}
}

/* article h2 */

article h2,
#FruitsBox .name {
font-family: 'M PLUS Rounded 1c', sans-serif;
}
article h2 {
min-height: 82px;
text-align: center;
margin: 0 0 3rem 0;
}
article h2::before,
article h2::after {
content:"";
}
article h2::after {
transform: scale(-1, 1);
}
article:not(.black) h2 + .read {
margin: 0 0 2em 0;
overflow: hidden;
}
article h2 + .read .photo {
width: 260px;
}
article h2 + .read .photo ~ * {
}
@media screen and (max-width:1023px){
article h2::before {
display: block;
width: 100%;
height: 50px;
vertical-align: middle;
background: url("images/back-h2-02.png")center top/240px auto no-repeat;
margin: .3em 0;
}
article h2 .text {
color:#477A00;
}
article h2 + .read .photo {
margin: 0 auto .5em;
}
}
@media screen and (min-width:1024px){
article h2::before,
article h2::after {
display: inline-block;
width: 90px;
height: 82px;
vertical-align: middle;
background: url("images/back-h2-01.png")center center/auto 82px no-repeat;
}
article h2 + .read .photo {
float: left;
}
article h2 + .read .photo ~ * {
margin: 0 0 0 280px;
}
}

/* article h2 text */

article h2 .text {
font-size: 2.6rem;
line-height: 100%;
display: inline-block;
padding: 0 1em;
vertical-align: middle;
}
article h2 .sub {
font-size: 1.4rem;
letter-spacing: 0;
line-height: 120%;
display: block;
}
@media screen and (min-width:1024px){
article h2 .text {
letter-spacing: 2px;
}
}

/* article h3 */

article h3 {
color:#669900;
margin: 0 0 1em 0;
}
article h3 +.read {
margin: 0 0 2em 0;
}
@media screen and (max-width:1023px){
article h3 {
font-size: 2rem;
text-align: center;
line-height: 120%;
padding: 2em .6em .6em .6em;
border-top:1px solid #B9DC43;
border-bottom:1px solid #B9DC43;
background: url("images/point01.png")top 10px center/auto 23px no-repeat rgba(255,255,255,.7);
}
}
@media screen and (min-width:1024px){
article h3 {
font-size: 2.2rem;
text-align: left;
padding: .6em 1em .6em 2em;
border-radius: 8px;
border:1px solid #B9DC43;
background: url("images/point01.png")left 10px center/auto 23px no-repeat rgba(255,255,255,.7);
}
}

/* article h4 */

article h4 {
font-size: 1.9rem;
color:#477A00;
margin: 0 0 .5em;
}
article h4::before {
content:"";
display: inline-block;
width: 35px;
height: 26px;
background: url("images/point02.png")center center/auto 26px no-repeat;
vertical-align: middle;
}
@media screen and (max-width:1023px){
article > section section h4 {
text-align: center;
margin: 0 0 1em 0;
}
article h4::after {
content:"";
display: inline-block;
width: 35px;
height: 26px;
background: url("images/point02.png")center center/auto 26px no-repeat;
vertical-align: middle;
}
}
@media screen and (min-width:1024px){
article > section section h4 {
margin: 0 -.7em .5em -.7em;
}
}

/* article section */

.yellow > section:not(:last-of-type) {
margin: 0 0 4em 0;
}
.yellow > section section:not(:last-of-type) {
margin: 0 0 4em 0;
}
@media screen and (max-width:1023px){
#What.yellow > section section:not(:last-of-type) {
margin: 0 0 4em;
}
}
@media screen and (min-width:1024px){
.yellow > section section {
padding: .2em .7em 0;
}
#What.yellow > section section:not(:last-of-type) {
margin: 0;
}
}

/* article black */

.black {
width: 102%;
height: 102%;
background: rgba(0,0,0,.6);
position: fixed;
left:50%;
top:50%;
z-index: 99999999;
transform: translate(-50%,-50%);
transition: .7s ease;
}
.black.hidden {
width: 0;
height: 0;
}
.black.hidden * {
display: none;
}
.black section {
position: absolute;
padding: 30px 8%;
background: rgba(255,255,255,1.0);
border-radius: 10px;
left:50%;
top:50%;
overflow-y: auto;
overflow-x: hidden;
animation: appear01 0.7s ease;
transform: translate(-50%,-50%);
}
.black h2 + .read {
text-align: center;
}
/***/
@media screen and (max-width:1023px){
#Contact.black {
width: 100%;
height: auto;
position: relative;
background: none;
left:auto;
top:auto;
transform: none;
z-index: auto;
}
#Contact.black.hidden,
#Contact.black.hidden *:not(em) {
display:block;
position: relative;
}
#Contact.black.hidden em {
display: inline;
}
#Contact section {
padding: 30px 3%;
overflow-y: scroll;
left:auto;
top:auto;
transform: none;
}
#FruitsBox section {
min-width: 90%;
padding: 15px;
}
}
@media screen and (min-width:1024px){
#Contact section {
min-width: 70%;
}
#FruitsBox section {
min-width: 60%;
}
}

/* black section anime */

@keyframes appear01 {
0% {display: none; opacity: 0;}
70% {display: block; opacity: 0;}
100% {opacity: 1;}
}
@-webkit-keyframes appear01 {
0% {display: none; opacity: 0;}
70% {display: block; opacity: 0;}
100% {opacity: 1;}
} 

/* section photo */

article section {
overflow: hidden;
}
article > section section .photo {
width: 200px;
}
@media screen and (max-width:1023px){
article > section section .photo {
margin: 0 auto 1em;
}
}
@media screen and (min-width:1024px){
article > section section .photo.left {
float: left;
}
article > section section .photo.right {
float: right;
}
article > section section .photo.left + .read {
padding: 0 0 0 220px;
}
article > section section .photo.right + .read {
padding: 0 220px 0 0;
}
}

/* attention */

.attention {
padding: .5em;
border:1px dotted #9C0;
background: rgba(255,255,255,0);
}

/* num-list */

.num-list {
counter-reset: item;
}
.num-list li {
color:#930;
margin: 0 0 .3em 0;
}
.num-list li::before {
display: inline-block;
counter-increment:item;
content: counter(item);
font-size: 1.4rem;
color:#FFF;
width: 1.4em;
line-height: 1.4em;
text-align: center;
vertical-align: middle;
background: #930;
border-radius:1em; 
margin: 0 .4em 0 0;
}
@media screen and (max-width:1023px){
.num-list {
font-size: 1.5rem;
}
}
@media screen and (min-width:1024px){
.num-list {
font-size: 1.7rem;
padding: 0 0 .4em .4em;
}
}

/* target */

.target {
font-size: 1.7rem;
font-weight: 600;
color:#477A00;
padding: 1em 0 .5em;
}
.target .kind {
font-size: 1.5rem;
font-weight: 400;
line-height: 26px;
color:#FFF;
background: #477A00;
padding: .2em .5em;
margin: 0 1em 0 0;
position: relative;
}
@media screen and (max-width:1023px){
.target .kind {
border-radius: 4px;
}
}
@media screen and (min-width:1024px){
.target .kind {
border-radius: 4px 0 0 4px;
}
.target .kind::after {
content:"";
display: block;
position: absolute;
right: -13px;
top:0;
width: 0;
height: 0;
border-left:13px solid #477A00;
border-top:13px solid transparent;
border-bottom:13px solid transparent;
}
}
/* curri */

.curri,
.curri + .total{
border:1px solid #9C0;
background: #FFF;
}
.curri {
margin: 0 0 .5em;
}
.curri li {
padding: .8em;
display: flex;
justify-content: flex-start;
align-items: center;
}
.curri li:not(:last-of-type) {
border-bottom:1px solid #9C0;
}
.curri .time {
width: 5em;
color:#477A00;
}
.curri .data {
width: 100%;
}
.curri .data p:not(:last-of-type) {
margin: 0 0 .8em;
padding: 0 0 .8em;
border-bottom:1px dotted #9C0;
}
.curri .kind {
font-size: 1.3rem;
width: 6em;
line-height: 110%;
padding: .4em 0;
text-align: center;
background: #063;
color:#FFF;
border-radius: 20px;
}
.curri .kind.practical {
background: #690;
}
.curri .kind.test {
background: #930;
}
@media screen and (max-width:1023px){
.curri,
.curri + .total{
width: 100%;
}
.curri .kind {
display: block;
margin: 0 0 .7em 0;
}
}
@media screen and (min-width:1024px){
.curri,
.curri + .total{
width: 85%;
}
.curri .kind {
display: inline-block;
margin: 0 .5em 0 0;
}
}

/* .etc */

.etc {
overflow: hidden;
}
.etc dt {
color:#477A00;
}
.etc dt::before {
content:"■";
}
.etc dt::before,
.etc li::before {
font-size: 1.2rem;
color:#9C0;
}
.etc dd {
margin: 0 0 .4em 0;
border-bottom:1px dotted #9C0;
}
.etc li {
display: inline-block;
margin: 0 1.2em .3em 0;
}
.etc li::before {
content:"●";
}
@media screen and (max-width:1023px){
.etc dt {
margin: 0 0 .4em;
}
.etc dd {
padding: 0 0 .4em;
}
}
@media screen and (min-width:1024px){
.etc dt {
width: 11em;
float: left;
}
.etc dd {
padding: 0 0 .4em 12em;
}
}

/* price time */

.price,
.etc .time {
font-size:1.9rem;
color:#930;
}

/* enquiry */

.enquiry:not(.nav) {
text-align: center;
padding: 2em 0 0 0;
}
.enquiry:not(.nav) .button,
.enquiry-list + p .submit,
.enquiry-list + p .reset {
line-height: 110%;
border-radius: 2em;
transition: 0.5s ease;
}
.enquiry:not(.nav) .button,
.enquiry-list + p .submit {
color:#FFF;
background: url("images/point03.png")left 1.5em center/auto 23px no-repeat #477A00;
}
.enquiry:not(.nav) .button {
font-size: 1.6rem;
padding: 1em 2em 1em 4em;
}
.enquiry:not(.nav) a.button {
display: block;
}
.enquiry:not(.nav) .button:hover,
.enquiry-list + p .submit:hover {
color:#FFC;
background: url("images/point03.png")left 2em center/auto 23px no-repeat #2D5A00;
}
@media screen and (max-width:1023px){
.enquiry:not(.nav) .button {
max-width: 100%;
}
}

/* enquiry list */

.enquiry-list {
padding: 1em 0;
overflow: hidden;
}
.enquiry-list dt {
font-weight: 500;
color:#477A00;
}
.enquiry-list dt::before {
content:"";
display: inline-block;
width: 15px;
height: 15px;
background: url("images/point01.png")left center/auto 14px no-repeat; 
margin: 0 .3em 0 0;
vertical-align: middle;
}
.enquiry-list dd {
border-bottom: 1px dotted #9C0;
}
.enquiry-list > dd:nth-of-type(odd),
.enquiry-list dd.before {
}
.enquiry-list dd input[type="radio"]{
display: none!important;
}
.enquiry-list dd label {
cursor: pointer;
}
.enquiry-list dd label:before {
content:"";
display: inline-block;
width: 1em;
height: 1em;
border:1px solid #9C0;
vertical-align: middle;
margin: 0 .3em 0 0;
}
.enquiry-list dd label.select:before {
background: url("images/point05.png")center center/auto 10px no-repeat;
}
.enquiry-list .hidden {
display: none;
}
@media screen and (max-width:1023px){
.enquiry-list dt {
padding: .5em 0 0;
}
.enquiry-list dd {
padding: .5em 0;
}
.enquiry-list dd label {
border:1px solid #9C0;
border-radius: 2em;
margin: 0 0 .3em;
padding: .5em .5em .5em 1em;
}
}
@media screen and (min-width:1024px){
.enquiry-list dt {
width: 15em;
padding: .5em 0 0 1em;
float: left;
}
.enquiry-list dd {
padding: .5em 0 .5em 15.5em;
}
.enquiry-list dd label {
cursor: pointer;
}
}

/* enquiry list special */

.enquiry-list dd.special {
padding: 0;
border-bottom: none;
}
.enquiry-list dd.special dl {
display: none!important;
}
#WantClass:checked + dl,
#WantSchool:checked + dl{
display: block!important;
}


/* form button */

.enquiry-list + p {
text-align: center;
}
.enquiry-list + p .button {
font-size: 1.4rem;
padding: .7em 2em .7em 4em;
}
.enquiry-list + p .submit {
margin: 0 .3em 0 0;
}
.enquiry-list + p .reset {
color:#333;
background: url("images/point04.png")left 1.5em center/auto 23px no-repeat #CCC;
}
.enquiry-list + p .reset:hover {
color:#333;
background: url("images/point04.png")left 2em center/auto 23px no-repeat #999;
}
#Contact form + p,
#FruitsBox .data + p {
width: 40px;
position: absolute;
top: 5px;
right: 5px;
}
@media screen and (max-width:1023px){
.enquiry-list + p .button {
display: inline-block!important;
}
#Contact form + p {
display: none!important;
}
}

/* close */

.button.close {
width: 100%;
line-height: 40px;
font-size: 2.2rem;
color:#FFF;
border-radius: 20px;
background: #477A00;
}

/* Profile */

#Profile > section:not(:last-of-type) {
padding: 0 0 80px;
}
#Profile .photo.left {
width: 180px;
}
#Profile .profile-data {
padding: 0.5em 0 0 0;
}
#Profile .profile-data > li:not(.outline) {
padding: 0 0 0.5em;
margin: 0 0 0.5em;
border-bottom:1px dotted #477A00;
}
#Profile .name {
font-size: 2.2rem;
font-weight: 600;
color:#477A00;
letter-spacing: 0.1em;
}
#Profile .name .sub {
font-size: 1.6rem;
}
#Profile .title li {
padding: 0 0 0 1.5em;
margin: 0 0 0.7em;
line-height: 120%;
background: url("images/point01.png")left top/14px auto no-repeat;
}
@media screen and (max-width:1023px){
#Profile > section:not(:last-of-type) {
background: url("images/line01.png")center bottom/100% auto no-repeat;
}
#Profile .photo.left {
margin: 0 auto;
}
#Profile .profile-data {
margin: 0 0 3em;
}
#Profile .name {
text-align: center;
}
}
@media screen and (min-width:1024px){
#Profile > section:not(:last-of-type) {
background: url("images/line01.png")center bottom/auto 42px no-repeat;
}
#Profile .photo.left {
float: left;
}
#Profile .profile-data {
margin: 0 0 0 200px;
}
}

/* FruitsBox */

#FruitsBox .photo img {
box-shadow: none;
}
@media screen and (max-width:1023px){
#FruitsBox .photo {
width: 90px;
margin: 0 auto .5em;
}

#FruitsBox .name {
font-size: 2.2rem;
padding: 0 0 .4em;
margin: 0 0 .4em;
border-bottom: 1px dotted #9C0;
}
#FruitsBox .detail {
margin: 0 0 .4em 0;
}
#FruitsBox .movie {
margin: 0 0 .8em 0;
}
#FruitsBox .movie iframe {
width: 100%;
height: 100%;
}
#FruitsBox .whats {
display: none;
}
}
@media screen and (max-width:479px){}
@media screen and (min-width:480px) and (max-width:1023px){
#FruitsBox .photo {
float: left;
}
#FruitsBox .data {
margin: 0 0 0 100px;
}
}
@media screen and (min-width:1024px){
#FruitsBox > section {
display: flex;
justify-content: space-between;
}
#FruitsBox .photo {
display: flex;
align-items: center;
width: 100%;
max-width: 180px;
}
#FruitsBox .data {
width: 100%;
max-width: calc(100% - 220px - 20px);
}
#FruitsBox .name {
font-size: 2.2rem;
padding: 0 0 .4em;
margin: 0 0 .4em;
border-bottom: 1px dotted #9C0;
}
#FruitsBox .detail {
margin: 0 0 .4em 0;
}
#FruitsBox .movie {
margin: 0 0 .8em 0;
}
#FruitsBox .movie iframe {
width: 100%;
height: 100%;
}
#FruitsBox .whats {
padding: 0.4em 0.6em;
border:1px dotted #9C0;
}
}

/**/

#FruitsBox .fadeout {
animation: fadeout01 0.5s ease forwards;
}
@keyframes fadeout01 {
0% {opacity: 1;}
70% {opacity: 0;}
100% {opacity: 0;display: none;}
}
@-webkit-keyframes fadeout01 {
0% {opacity: 1;}
70% {opacity: 0;}
100% {opacity: 0;display: none;}
}

/**/

#FruitsBox .fadein {
animation: fadein01 1s ease forwards;
}
@keyframes fadein01 {
0% {opacity: 0;}
70% {opacity: 0;}
100% {opacity: 1;display: block;}
}
@-webkit-keyframes fadein01 {
0% {opacity: 0;}
70% {opacity: 0;}
100% {opacity: 1;display: block;}
}

/* footer */

footer {
font-size:1.4rem;
color:#FFF;
width: 100%;
background: #477A00;
}
footer.pink {
background: #FF9999;
}
footer.blue {
background: #3399CC;
}
@media screen and (max-width:1023px){
footer {
padding: 0.7em 0 6em 0;
}
}
@media screen and (min-width:1024px){
footer {
padding: 0.7em 0 3em 0;
}
}

/* Thanks */

#Thanks {
display: flex;
flex-direction: column;
justify-content:flex-end;
}
#Thanks #Big {
display: none;
}
#Thanks main {
display: block;
height: 100%;
}
#Thanks main > article {
height: auto;
position: absolute;
left:50%;
top:50%;
transform: translate(-50%,-50%);
text-align: center;
}
#Thanks a {
color:#FFF;
padding: .7em 1em .7em 2em;
background: url("images/point03.png")left 10px center/auto 1em  no-repeat #477A00;
border-radius: 2em;
}

@media screen and (max-width:1023px){
#Thanks main > article {
width: 85%;
padding: 2em 0 0 0;
}
#Thanks header {
display: none;
}
#Thanks footer {
padding: .7em 0;
}
#Thanks a {
display: block;
margin: .5em 0;
}
}
@media screen and (min-width:480px) and (max-width:1023px){
#Thanks .tree{
width: 160px;
height: 145px;
}
#Thanks main > article {
width: 75%;
}
#Thanks a {
display: inline-block;
margin: .5em .5em 0 0;
}
}
@media screen and (min-width:1024px){
#Thanks a {
display: inline-block;
margin: 2em 0 .5em 0;
}
#Thanks a:nth-of-type(1){
margin: 2em .5em .5em 0;
}
}