/* header */
header #cis {position:absolute;top:5vw;left:0;z-index:900;}
header #cis a {margin:auto;}
header #menubtn {width:10vw;height:10vw;}
/* hSearch */
#hSearch {top: 0;}
/* wrap */
#wrap {z-index:5;}
/* section */
section {padding:5vw 0 2vw;}
section >* {z-index:3;}
section .title_box h2 {padding:2px 5px;font-size:28px;border:var(--secondary) solid;border-width:0 1px;z-index:20;right:20px;bottom:30px;}
/* about_area */
#about_area .title h2 {font-size:30px;}
#about_area .info article {line-height:200%;letter-spacing:.5em;font-size:18px;}
#about_area {position:relative;}
#about_area .eside_picture01 {position:absolute;left:5%;width:220px;bottom:0;animation:rataeab 4s infinite;-webkit-filter:drop-shadow(6px 5px 7px rgb(190 190 190 / 60%));filter:drop-shadow(6px 5px 7px rgb(190 190 190 / 60%));}
#about_area .eside_picture02 {position:absolute;right:5%;width:200px;bottom:0;animation:rataeab2 4s infinite;-webkit-filter:drop-shadow(6px 5px 7px rgb(190 190 190 / 60%));filter:drop-shadow(6px 5px 7px rgb(190 190 190 / 60%));}
@keyframes rataeab {0% {transform:rotate(0)}
25% {transform:rotate(7deg)}
75% {transform:rotate(-7deg)}
}
@keyframes rataeab2 {0% {transform:rotate(0)}
25% {transform:rotate(-7deg)}
75% {transform:rotate(7deg)}
}
/*freebox*/
#freebox {position:relative;padding-bottom:0;background:no-repeat 0 bottom / auto 70%;padding-top:8vw;}
#freebox:before {content:"";position:absolute;width:100%;height:100%;background-image:url(/images/freeboxbg.webp);background-repeat:no-repeat;z-index:-1;bottom:-27vw;}
#freebox .img_box {margin:0 0 5vw 10vw;border-bottom-left-radius:200px;}
#freebox .img_box img {height:60vw;}
#freebox .illustrate p {position:relative;display:flex;font-size:16px;color:#6e6e6e;font-weight:300;}
#freebox .Ainfo_box {position:absolute;width:calc(41% - 40px);right:0%;z-index:9;bottom:-80px;padding:40px;padding-right:5%;background:white;}
#freebox .Atext_box {display:flex;}
#freebox .illustrate {width:calc(98% - 68px);display:flex;margin-top:20px;padding:0 2%;}
#freebox .title_box {width:68px;display:flex;flex-direction:column;order:2;}
/* product_area */
#product_area {padding-bottom:0;background:no-repeat 0 bottom / auto 70%;width:1700px;max-width:95%;margin:0 auto;}
section#product_area .title_box {display:flex;margin-bottom:4vw;flex-direction:column;align-items:center;}
#product_area #product_list {margin-bottom:50px;}
section#product_area .title_box h2 {position:relative;border:unset;border-top:var(--secondary) 1px solid;border-bottom:var(--secondary) 1px solid;right:unset;bottom:unset;}
#product_area .img_box {margin:0 0 5vw 10vw;display:inline-block;vertical-align:top;text-align:center;position:relative;height:100%;-webkit-box-shadow:0px 5px 15px 0px rgb(128 128 128 / 0%);box-shadow:0px 5px 15px 0px rgb(128 128 128 / 0%);margin:10px 10px 15px;background:#fff;border-radius:300px 300px 0px 0px;filter:drop-shadow(2px 4px 6px #ddd);overflow:hidden;border-bottom:0px;}
#product_area .img_box img {height:60vw;}
#product_area .info {position:relative;padding:0 5px;width:100%;height:190px;box-sizing:border-box;z-index:10;right:0;bottom:0;justify-content:space-between;align-items:flex-end;}
#product_area .info >div {margin:auto;width:100%;}
#product_area .info h3 {height:37px;font-size:22px;}
#product_area .info article {margin:10px 0 20px;font-size:15px;height:51px;-webkit-line-clamp:2;}
#product_area .info p {margin-right:10px;font-weight:300;}
#product_area .info p:first-letter {margin-right:2px;font-size:12px;}
#product_area .info .price_box {height:28px;}
/* news_area */
#news_area >div {padding:7% 0 0 5%;justify-content:space-between;}
#news_area .bg_box {width:750px;height:550px;border-top-right-radius:200px;top:0;left:0;opacity:.3;background-image:url(/images/freeboxbg.webp);}
#news_area .title_box h2 {margin-bottom:50px;}
#news_list {margin-left:5vw;padding:6vw 0 6vw 6vw;box-sizing:border-box;flex:1;}
#news_list ul {border-top:1px rgba(var(--secondary-rgb),.6) solid;}
#news_list ul li >div {padding:0 30px;border-bottom:1px rgba(var(--secondary-rgb),.2) solid;}
#news_list ul li .time {margin-right:40px;width:70px;font-size:14px;}
#news_list ul li h3 {margin:30px 0;width:calc(100% - 110px);}



/* book_area */
#book_area li .img_box { border-radius: 15px; background-color: #f9f9f9; }
#book_area li h3 { margin-top: 10px; height: 30px; font-size: 18px; }

section#book_area .title_box {display:flex;margin-bottom:4vw;flex-direction:column;align-items:center;}

section#book_area .title_box h2 {position:relative;border:unset;border-top:var(--secondary) 1px solid;border-bottom:var(--secondary) 1px solid;right:unset;bottom:unset;}

@media screen and (min-width:1281px) {header #cis {height:16vw;display:flex;top:auto;bottom:0;}
header #webmenu {position:absolute;top:1vw;width:96%;display:flex;justify-content:space-between;padding: 0 2%;}
header #webmenu nav {display:flex;align-items:center;}
}
@media screen and (min-width:1025px) {#about_area .about_wrap {width:100%;flex-direction:row-reverse;justify-content:center;}
#about_area .title {margin:0 20px;align-items:flex-start;flex-direction:row-reverse;}
#about_area .info article {height:300px;line-height:3em;}
#product_area .img_box {margin-left:5px;}
#product_area .img_box img {height:400px;}
#freebox .img_box {margin-left:13.33333%;}
#freebox .img_box img {height:45vw;}
#news_list {margin-left:180px;padding:75px;}
}
@media screen and (max-width:1460px) {#freebox:before {bottom:-15vw;}
#product_area .img_box img {height:295px;}
}
@media screen and (max-width:1280px) {#about_area .about_wrap {display:flex;flex-direction:column;align-items:flex-start;}
#about_area .title {margin:0 0 13px;}
#about_area .eside_picture01 {bottom:-60px;left:3%;width:149px;}
#about_area .eside_picture02 {bottom:auto;top:-56px;width:130px;}
}
@media screen and (max-width:1024px) {section .title_box h2 {padding:2px;border-width:1px 0;right:15px;bottom:15px;}
#about_area .info {margin:30px auto 0;width:80%;}
}
@media screen and (max-width:980px) {
    #freebox .Atext_box{flex-direction: column;}
    #freebox .title_box{width: 100%;order: 0;}
    #freebox .illustrate{width: calc(98% - 0px);}
    #product_area .img_box {border-bottom-left-radius:0;}
    #product_area .info {margin-top:0;padding:6px;width:100%;}
    #product_area .info article {height:50px;-webkit-line-clamp:2;}
    #news_area .bg_box {width:100%;height:70%;}
    #news_list {margin:6vw 0 0 0;}
    #freebox .Ainfo_box {position:relative;width:calc(100% - 40px);padding-right:0%;padding:40px 20px;bottom:0;}
    #product_area .img_box img {height:270px;}
    #freebox .img_box {border-bottom-left-radius:100px;}
}
@media screen and (min-width:641px) {header #cis {width:100%;}
}
@media screen and (max-width:640px) {header #cis {top:15px;left:4%}
header #menubtn {width:65px;height:65px;}
#news_list ul li >div {padding:10px;}
#news_list ul li .time {font-weight:100;font-size:12px;}
#news_list ul li h3 {margin:0;width:100%;}
}
@media screen and (max-width: 480px){
	#book_area li .row { margin: auto; width: 250px; }
}
