#section1 .box1 .txt1{ font-weight:300; text-align:center;}
#section1 .box1 h3{ color:#6FB92C; padding-bottom:0.5em; border-bottom:solid 0.05em #727171;font-weight:400;}
#section1 .box1 .txt2{ font-weight:300;}
#section1 .box1 .imgbox img{ width:100%;}
#section2 .box1{ background:url(../images/common/images/common20.png); position:relative;}
#section2 .box1 h2{background:url(../images/greeting/images/greeting1.png); text-align:center; color:#fff;}
#section2 .box1 h2 .s1{text-align:center; color:#fff;}
@keyframes pon{0%{ transform:scale(0,0)}40%{transform:scale(1.2,1.2);}65%{transform:scale(0.9,0.9);}80%{transform:scale(1.1,1.1);}100%{transform:scale(1,1);}}
#section2 .box2 .txtbox{ background:#E8F4D5;}
#section2 .box2 .txtbox h2{color:#007A28; }






/*ーーーーーーーーーーーーーーーー
pcの時のみ使用するCSS
ーーーーーーーーーーーーーーーー*/

@media screen and (min-width: 769px) {
#section1 .box1 .imgbox{ width:330px; position:absolute; right:0; top:80px;}
#section1 .box1 .imgbox .txt1{ padding:20px 0; font-size:25px;}
#section1 .box1{ width:480px; margin:auto; position:relative; padding:40px 500px 0 0;}
#section1 .box1 h3{font-size:25px;}
#section1 .box1 .txt2{ padding:20px 0 100px;}
#section2 .box1 h2{ font-size:35px; padding:20px 0;} 
#section2 .box1 h2 .s1{ font-size:25px;} 
#section2 .box1 .img1{ margin:auto; display:block; padding:50px 0;}
#section2 .box1 .img2{ position:absolute; right:calc(50% - 510px); top:50px; transform:scale(0,0);}
#section2 .anime1_a .img2 {animation-name:pon; animation-delay:0.5s; animation-duration:0.5s;animation-fill-mode: forwards; animation-timing-function:ease;}
#section2 .box1 ul{ width:1020px; margin:auto; padding-bottom:100px;}
#section2 .box1 ul li{ width:33.333333%; float:left;}
#section2 .box1 ul li:nth-of-type(7) {padding-left:16.66666666%;}
#section2 .box1 ul li img{ display:block; margin:auto; transform:scale(0,0);}
#section2 .anime1_a li img{animation-name:pon; animation-duration:0.5s;animation-fill-mode: forwards; animation-timing-function:ease;}
#section2 .box1 ul li:nth-of-type(1) img{ animation-delay:0.50s;}
#section2 .box1 ul li:nth-of-type(2) img{ animation-delay:0.75s;}
#section2 .box1 ul li:nth-of-type(3) img{ animation-delay:1.00s;}
#section2 .box1 ul li:nth-of-type(4) img{ animation-delay:1.25s;}
#section2 .box1 ul li:nth-of-type(5) img{ animation-delay:1.50s;}
#section2 .box1 ul li:nth-of-type(6) img{ animation-delay:1.75s;}
#section2 .box1 ul li:nth-of-type(7) img{ animation-delay:2.00s;}
#section2 .box1 ul li:nth-of-type(8) img{ animation-delay:2.25s;}
#section2 .box2{ padding:50px 0;}
#section2 .box2 .txtbox{border-radius:50%; width:642px; height:642px; margin:auto; position:relative; padding:50px;}
#section2 .box2 .txtbox h2{ text-align:center; font-size:25px; padding:50px 0;}
#section2 .box2 .txtbox img{ position:absolute;}
#section2 .box2 .txtbox p{ font-size:18px; line-height:2; width:580px; margin:auto; letter-spacing:-0.05em;}
#section2 .box2 .txtbox .img1{ top:0; left:-40px;}
#section2 .box2 .txtbox .img2{ bottom:-40px; right:200px;}
#section2 .box2 .txtbox .img3{ bottom:40px; right:-40px;}
}


/*ーーーーーーーーーーーーーーーー
spの時のみ使用するCSS
ーーーーーーーーーーーーーーーー*/
@media screen and (max-width: 768px) {
#link1{ bottom:15.8vw;}
#section1 .box1{ width:95%; margin:auto;}
#section1 .box1 .imgbox .txt1{ padding:2vw 0 0;}
#section1 .box1 .imgbox{ width:50%; margin:auto; padding-bottom:5vw;}
#section1 .box1 .txt2{ padding:2vw 0 5vw; font-size:4vw;}
#section2 .box1 h2{ font-size:5vw; padding:20px 0;} 
#section2 .box1 h2 .s1{ font-size:4vw;} 
#section2 .box1 .img1{ margin:auto; display:block; padding:5vw 0; width:95%;}
#section2 .box1 .img2{ position:absolute; right:0; top:20vw; width:20vw;}
#section2 .box1 ul{ width:95%; margin:auto; padding:5vw 0;}
#section2 .box1 ul li{ width:50%; float:left;}
#section2 .box1 ul li img{ width:100%;}
#section2 .box2{ padding:25vw 0 10vw;}
#section2 .box2 .txtbox{border-radius:2em; width:calc(95% - 10vw);  margin:auto; position:relative; padding:5vw;}
#section2 .box2 .txtbox h2{ text-align:center; font-size:5vw; padding:5vw 0;}
#section2 .box2 .txtbox p{ font-size:4vw; line-height:1.6; letter-spacing:-0.05em;}
#section2 .box2 .txtbox .img1{ position:absolute; right:0; top:-20vw; width:30vw;}
#section2 .box2 .txtbox .img2{position:absolute; left:5vw; bottom:5vw; width:30vw;}
#section2 .box2 .txtbox .img3{ display:block; margin-left:auto; width:45vw;}
}













