/* header */
header #webmenu nav>ul>li>p a {   }
header.scroll { background: rgba(var(--secondary-rgb),.9); }
/* search_box */
#openform { background: rgba(var(--white-rgb),.3); }
/* section */
section { padding: 6vw 0 5vw; }
section.section_pad { padding: 5vw 0; }
section#news_area { position: relative; z-index: 6; padding-top: 250px; }
section#news_area .workframe {   }
section#news_area:before { content: ""; position: absolute; width: 700px; aspect-ratio: 7/4; background-image: url(/images/40/fly-plane.png); background-size: contain; background-repeat: no-repeat; right: 11%; top: 51px; z-index: 5566; animation: floatUpDown 4s infinite; }
@keyframes floatUpDown {
  0% { transform: translateY(0); }
  50% { transform: translateY(-15px); }
  100% { transform: translateY(0); }
}
section>* { z-index: 3; }
section .title_box { margin-bottom: 11px; padding-bottom: 10px; }
section .title_box:before { content: ""; position: absolute; width: 80vw; height: 1px; background: rgb(155 155 155/55%); bottom: 0; margin-left: -38%; z-index: 0; }
section .title_box .area_title { font-weight: 500; font-size: max(3.8 * (1vw + 1vh)/2,28px); color: var(--primary); }
section .submtext p { font-size: max(1.5 * (1vw + 1vh)/2,18px); color: #717171; }
section#about_area article p { font-size: max(1.3*(1vw + 1vh)/2,14px); color: #717171; font-weight: 400; line-height: 222%; }
section#about_area article { margin-top: 80px; margin-bottom: 80px; }
section .title_box .sub_title { font-weight: 500; font-size: max(1.5 * (1vw + 1vh)/2,14px); color: #717171; line-height: 100%; text-transform: uppercase; }
#photo_list img { animation: floatUpDown 3s infinite; }
#photo_list:before { content: ""; position: absolute; width: 80%; height: 92%; background: #e2e2e2; bottom: -7%; left: -9%; border-radius: 0px 0px 0px 60px; }
section .title_box2 { display: flex; flex-direction: column; align-items: center; }
section .title_box2 .sub_title { font-weight: 500; font-size: max(3.3 * (1vw + 1vh)/2,29px); color: #ffffff; line-height: 100%; display: flex; flex-direction: column; align-items: center; }
section .title_box2 .sub_title:before { position: absolute; content: ""; width: 300px; margin-top: 15px; aspect-ratio: 4/2; background: url(/images/40/panban.png); background-size: contain; background-repeat: no-repeat; background-position: 50%; z-index: -1; }
section .title_box2 .area_title { position: absolute; top: -65px; font-weight: 500; font-size: max(6.8 * (1vw + 1vh)/2,24px); color: rgb(255 255 255/15%); z-index: -1; letter-spacing: 0.35em; text-transform: uppercase; }
section#post_box .title_box .sub_title { color: #00021c; }
section#post_box .title_box .area_title { font-size: max(1.1*(1vw + 1vh)/2,12px); }
/* bg_box */
.bg_box { width: 100%; height: 100%; background: no-repeat 50%/cover; background-attachment: fixed; opacity: .3; top: 0; left: 0; }
#news_area .bg_box { opacity: 1; url(/images/40/Jabg.png): aliceblue; background: url(/images/40/Jabg.png); }
#news_area .bg_box:before { width: 92%; height: 54%; display: block; background: #e5e5e5; content: ""; border-radius: 0 60px 0 0; margin-top: 160px; }
.bg_box.white:before { background: rgba(var(--white-rgb),.2); }
/* about_area */
#about_area .info_box article,#about_area2 .info_box article { width: 90%; line-height: 210%; letter-spacing: 1.5px; font-weight: 300; margin-top: 20px; margin-bottom: 40px; }
#about_area { background: #f9fafe; z-index: 1; }
.flypanme { position: absolute; right: 7%; margin-top: -54px; z-index: 987; }
.flypanme img { object-fit: cover; }
#about_area .img_box { z-index: 2; }
#about_area .info_box,#about_area2 .info_box { padding: 20px; display: flex; flex-direction: column; }
#about_area .workframe,#about_area2 .workframe { display: flex; justify-content: space-between; align-items: center; z-index: 988; }
#about_area .workframe:before { content: ""; position: absolute; width: 1px; height: 134%; background: #c7c7c7; right: 0; top: -115px; z-index: 0; }
#about_area:before { content: ""; position: absolute; width: 129%; height: 1280px; background: url(/images/40/Jabg.png); top: -28%; left: -10%; }
#about_area:after { content: ""; position: absolute; width: 129%; height: 1280px; top: -28%; left: -10%; background: #fafafa; z-index: -1; }
#about_area2 { margin-top: 100px; }
a.boomlink { display: flex; align-items: center; padding: 8px 9px; width: 180px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; background: rgb(255 255 255/20%); justify-content: space-around; border-radius: 50px; color: #4a4a4a; letter-spacing: 0.15em; font-size: max(1.1 * (1vw + 1vh)/2,14px); transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; border: #acacac 1px solid; }
a.boomlink:hover { background: var(--primary); border: var(--primary) 1px solid; }
a.boomlink:hover span { color: white; }
a.boomlink:hover svg {   }
a.boomlink span { color: #3d3d3d; font-size: max(1.1*(1vw + 1vh)/2,14px); }
a.boomlink:hover svg { -moz-transform: rotate(3deg); -webkit-transform: rotate(3deg); -o-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(90deg); border-radius: 50%; fill: var(--primary); background: white; }
a.boomlink svg { width: 16px; aspect-ratio: 1/1; margin-left: 10px; fill: #ffffff; -moz-transform: rotate(3deg); -webkit-transform: rotate(3deg); -o-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(90deg); transition: all 0s ease-in-out; -webkit-transition: all 0s ease-in-out; background: var(--primary); border-radius: 50%; padding: 8px; }
/*mapotext*/
.mapotext { display: flex; background: #1c5890; padding: 15px 0; }
.mapotext .workframe { display: flex; align-items: center; }
.mapotext .workframe img { width: 38px; }
.mapotext .workframe span { width: 2px; height: 20px; background: rgb(255 255 255/64%); margin: 0 25px; }
.mapotext .workframe p { color: white; font-weight: 300; letter-spacing: 0.05em; }
/*post_box*/
#post_box { background-image: url(/images/40/gas_bg.jpg); }
#post_box .Jlinkbum ul { display: flex; justify-content: space-between; }
#post_box .Jlinkbum ul li { display: flex; flex-direction: column; width: 49%; position: relative; }
#post_box .Jlinkbum ul li:hover a.boomlink svg { -moz-transform: rotate(3deg); -webkit-transform: rotate(3deg); -o-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(90deg); border-radius: 50%; }
#post_box .Jlinkbum ul li:hover img { -moz-transform: scale(0.8); -webkit-transform: scale(0.8); -o-transform: scale(0.8); -ms-transform: scale(0.8); transform: scale(1.2); }
#post_box .Jlinkbum ul li * { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; color: white; }
#post_box .Jlinkbum ul li .Jboitem { overflow: hidden; border-radius: 20px; }
#post_box .Jlinkbum ul li a.ufolink { position: absolute; width: 100%; height: 100%; z-index: 6; }
#post_box .Jlinkbum ul li .Jboitem:before { content: ""; position: absolute; width: 100%; height: 100%; background-image: linear-gradient(to bottom,rgb(0 0 0/0%),rgb(0 0 0/83%)); border-radius: 20px; z-index: 2; }
#post_box a.boomlink { background-image: unset; border: white 1px solid; }
#post_box .Jlinkbum ul li .Jbinfo { position: absolute; bottom: 0; display: flex; width: 100%; flex-direction: column; padding: 18px 25px; z-index: 3; }
#post_box .Jlinkbum ul li .Jbinfo .topJb { display: flex; justify-content: flex-end; }
#post_box .Jlinkbum ul li .Jbinfo .topJb p { color: white; width: 85%; display: flex; align-items: center; }
#post_box .Jlinkbum ul li .Jbinfo .topJb p:before { content: ""; position: absolute; width: 10%; height: 1px; background: white; left: 4%; }
#post_box .Jlinkbum ul li .Jbinfo .textJb { display: flex; align-items: center; justify-content: space-between; }
#post_box .Jlinkbum ul li .Jbinfo .textJb p { font-size: max(2.2 * (1vw + 1vh)/2,27px); color: white; }
#art_box { background-image: url(/images/40/sogon_bg.jpg); background-attachment: fixed; padding: 10vw 0 4vw; display: flex; flex-direction: column; align-items: center; }
#art_box .workframe { display: flex; flex-direction: column; align-items: center; }
#art_box:before { content: ""; position: absolute; width: 42px; aspect-ratio: 1/1; background: #fdfdfd; border-radius: 50%; top: -27px; }
#art_box .art_textbox { display: flex; flex-direction: column; align-items: center; margin-top: 222px; }
#art_box .art_textbox * { color: white; }
#art_box .art_textbox h3 { font-size: max(1.4*(1vw + 1vh)/2,16px); }
#art_box .art_textbox p { font-size: max(1.1*(1vw + 1vh)/2,16px); font-weight: 300; }
/*productBox*/
#productBox { position: relative; padding: 7vw 0 4vw 4vw; z-index: 2; background: #ffffff; margin-top: 45px; }
#productBox .more { display: flex; margin-left: 17%; margin-top: 45px; margin-bottom: 85px; align-items: center; width: 59%; }
#productBox .more span.litem { flex: 1; display: flex; justify-content: flex-end; font-size: max(1.1*(1vw + 1vh)/2,14px); }
#productBox .more .litemline { width: 90px; height: 1px; background: #909090; margin-left: 10px; }
#productBox .more a { margin-right: 11px; }
#productBox .bg { position: absolute; width: 30vw; height: 17vw; background: no-repeat 50%/cover; box-shadow: 0 0 40px 0 rgba(0,0,0,.3); top: -7vw; right: 10vw; z-index: 4; }
#productBox .titleBox { writing-mode: vertical-rl; width: 10%; }
#productBox .titleBox .boxtit { font-size: max(4.2*(1vw + 1vh)/2,28px); color: #242424; line-height: 150%; }
#productBox .titleBox p { font-weight: 500; font-size: max(1.5 * (1vw + 1vh)/2,14px); color: #717171; line-height: 100%; text-transform: uppercase; }
#productBox .productinfo { position: relative; z-index: 3; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; }
#productBox:before {content: "";position: absolute;aspect-ratio: 52/90;background: url(/images/40/po_left_bg.png);width: calc(100% - 300px);top: 0;left: 0;background-size: contain;z-index: 0;}
#productBox:after { content: ""; position: absolute; background: url(/images/40/po_right_bg.png); height: 108%; top: -8%; background-size: contain; right: 0; background-repeat: no-repeat; aspect-ratio: 46/97; }
#productBox .productinfo:after {   }
#productBox .productinfo ul { width: 85%; }
#productBox .productinfo .slick-list { padding-right: 6%; }
#productBox .productinfo ul li { position: relative; margin: 25px 30px; filter: drop-shadow(0 0 8px rgba(var(--black-rgb),.1)); }
#productBox .productinfo ul li a { position: absolute; width: 100%; height: 100%; z-index: 2; }
#productBox .productinfo ul li .info .tt { background: #fff; padding: 30px 30px; border-radius: 0 0 50px 20px; margin-top: -27px; }
#productBox .productinfo ul li .img { background: no-repeat 50%/cover; border-radius: 50px 20px 0 0; }
#productBox .productinfo ul li .price { font-size: max(1 * (1vw + 1vh)/2,15px); background: #cf817f; display: inline-block; color: #fff; padding: 5px 45px; margin-top: -35px; margin-left: -10px; position: absolute; right: -20px; margin-top: -46px; }
#productBox .productinfo ul li .price:after { content: ""; position: absolute; right: 0; width: 0; border: 10px #b46a68 solid; border-bottom-color: transparent; border-right-color: transparent; bottom: -20px; }
#productBox .productinfo ul li h3 { height: 37px; font-size: 22px; -webkit-line-clamp: 1; color: #303030; }
#productBox .productinfo ul li p { height: 23px; font-size: 14px; -webkit-line-clamp: 1; margin: 10px 0; color: #6a6c6e; }
#productBox .productinfo ul li article { height: 75px; font-weight: 400; -webkit-line-clamp: 3; line-height: 180%; font-size: max(1.2 * (1vw + 1vh)/2,14px); color: #717171; }
#productBox .slick-prev { z-index: 5; left: -35px; top: 43%; }
#productBox .slick-prev:before { display: block; content: url(/images/36/arrow-left.png); opacity: 1; box-shadow: 0 0 10px rgb(0 0 0/15%); width: 92px; height: 92px; border-radius: 50px; }
#productBox .slick-next { z-index: 5; right: 13%; top: 43%; }
#productBox .slick-next:before { display: block; content: url(/images/36/arrow-right.png); opacity: 1; box-shadow: 0 0 10px rgb(0 0 0/15%); width: 92px; height: 92px; border-radius: 50px; }
/* product_area */
#product_area .slick-list { overflow: visible; }
/* news_area */
#news_area .omgnw_list { display: flex; justify-content: flex-end; }
#news_area .omgnw_list .list_box {   }
#news_area .omgnw_list .list_box ul li { position: relative; margin: 25px 0 40px; }
#news_area .omgnw_list .list_box ul li .cage { display: flex; flex-direction: column; align-items: center; position: absolute; z-index: 5; right: 38px; top: -23px; background: var(--secondary); }
#news_area .omgnw_list .list_box ul li .cage a { color: white; padding: 10px 25px; width: 100%; text-align: center; font-size: max(1.1 * (1vw + 1vh)/2,15px); }
#news_area .omgnw_list .list_box { width: 90%; margin-top: 25px; display: flex; align-items: center; }
#news_area .omgnw_list .list_box:before { content: ""; position: absolute; width: 156px; left: -19px; aspect-ratio: 3/4; background-image: linear-gradient(to bottom,var(--primary),var(--secondary)); }
#news_area .list_box img { height: 425px; }
#news_area .list_box .info_box { padding: 15px 30px; position: absolute; bottom: -25px; display: flex; align-items: center; width: 100%; justify-content: space-between; background: white; border-radius: 0 0 35px 35px; height: 86px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border; }
#news_area .list_box .info_box p a { margin-right: 10px; max-width: calc(100% - 100px); font-weight: 400; z-index: 2; }
#news_area .list_box .info_box p .time { width: 90px; font-weight: 300; }
#news_area .list_box .info_box h3 { height: auto; font-size: max(1.5 * (1vw + 1vh)/2,18px); color: var(--info); }
/* book_area */
#book_area .list_box img { height: 450px; }
#book_area .list_box .img_box { border: var(--white) solid; border-width: 0 1px 1px 0; }
#book_area .list_box .img_box:before,#book_area .list_box .img_box:after { position: absolute; width: 100%; height: 100%; background: var(--white); z-index: 9; opacity: .4; content: ""; }
#book_area .list_box .img_box:after { right: 0; bottom: 0; }
#book_area .list_box .atag_item { z-index: 10; }
#book_area .list_box .badge { margin: auto; padding: 10px 20px; max-width: calc(80% - 40px); height: 34px; line-height: 36px; font-size: 20px; }
/* youtube_box */
#youtube_box { min-height: 1px; padding-bottom: 30%; }
#youtube_box a { position: absolute; background: var(--white); display: flex; top: 50%; left: 50%; z-index: 99; }
#youtube_box a i { margin: auto; font-size: 30px; color: var(--primary); }
#youtube_box iframe { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 5; }
/* custom_area */
#custom_area { margin: 0; padding: 5vw 0 3vw; }
#custom_area:before { position: absolute; width: 100%; height: 75%; background: rgba(var(--primary-rgb),.1); display: block; bottom: 0; left: 0; opacity: .3; content: ""; }
#custom_box { padding: 8vw 0 5vw; }
#custom_box li .row { margin: 30px 20px; padding: 30px; border-bottom: 2px var(--primary) solid; }
#custom_box li .row h2 { font-size: 20px; }
#custom_box li .row article { margin-top: 30px; line-height: 200%; }
@-webkit-keyframes spineer {
  0% { -webkit-box-shadow: 0 0 0 0 var(--info); }
  70% { -webkit-box-shadow: 0 0 0 20px transparent; }
  100% { -webkit-box-shadow: 0 0 0 0 transparent; }
}
@keyframes spineer {
  0% { box-shadow: 0 0 0 0 var(--info); }
  70% { box-shadow: 0 0 0 20px transparent; }
  100% { box-shadow: 0 0 0 0 transparent; }
}
@media screen and (min-width:1281px) {
  #book_area .list_box li:hover .badge { background: var(--primary); color: var(--white); }
  #custom_box li:hover .row { box-shadow: 0 4px 17px 0 rgba(var(--black-rgb),.2); }
}
@media screen and (max-width:1470px) {
  a.boomlink { padding: 5px 9px; }
  a.boomlink svg { width: 15px; }
  .flypanme { width: min(920px,90%); margin-top: -71px; }
  #about_area:before,#about_area:after { top: -19%; }
  #productBox .productinfo .slick-list { padding-right: 7%; }
  #productBox .productinfo ul li { margin: 21px 18px; }
  #productBox { padding: 7vw 0 3vw 2vw; }
  section#news_area:before { width: 600px; }
  #news_area .bg_box:before { margin-top: 100px; height: 51%; }
  section#news_area { padding-top: 155px; }
  #news_area .list_box img { height: 370px; }
  #news_area .list_box .info_box { height: 56px; border-radius: 0 0 20px 20px; }
  #news_area .omgnw_list .list_box:before { width: 10vw; }
  #news_area .omgnw_list { margin-bottom: 60px; }
}
@media screen and (max-width:1280px) {
  #productBox { padding: 7vw 0 3vw 5vw; }
  #productBox .productinfo ul li.slick-active .img { box-shadow: 0 0 10px 0 rgb(0 0 0/19%); }
  #productBox .titleBox { width: 100%; writing-mode: unset; margin-bottom: 30px; }
  #productBox .productinfo ul { width: 100%; }
  #productBox .more { width: 67%; margin-left: 0; }
}
@media screen and (max-width:1024px) {
  section#news_area:before { width: 400px; }
  #about_area .workframe { display: flex; flex-direction: column; }
  #about_area .img_box { margin-bottom: 66px; }
  #about_area:before { display: none; }
  #about_area:after { background-image: linear-gradient(to bottom,#fbfbfb,#f9fafe); }
  #productBox:after { display: none; }
  #productBox .productinfo .slick-list { padding-right: 0; }
  #productBox .titleBox { width: 100%; }
  #productBox .titleBox * { text-align: center; }
  #productBox:before { width: 95vw; }
  #productBox { padding: 5vw 3vw; }
  #productBox .slick-prev,#productBox .slick-next { display: none !important; }
}
@media screen and (max-width:980px) {
  #productBox .more { width: 100%; padding: 0 5%; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border; display: flex; justify-content: center; }
  #photo_list,#photo_list .pos_rel { display: flex; flex-direction: column; align-items: center; }
  #photo_list img { width: min(400px,90%); }
  #photo_list:before { width: 70%; left: 2%; }
  #productBox .bg { display: none; }
  #productBox .more span.litem,#productBox .more .litemline { display: none; }
  #about_area .workframe,#about_area2 .workframe { display: flex; flex-direction: column; }
  #about_area .workframe .img_box,#about_area2 .workframe .img_box { margin: 25px 0; }
  #about_area2 { margin-top: 40px; }
  #post_box .Jlinkbum ul { display: flex; flex-direction: column; align-items: center; }
  #post_box .Jlinkbum ul li { width: 100%; margin-bottom: 20px; }
}
@media screen and (max-width:768px) {
  #news_area .list_box .info_box { padding: 15px 13px; height: 70px; }
  #youtube_box { padding-bottom: 60vw; }
  #custom_box li .row { margin: 10px 15px; padding: 10px 0; }
  #about_area2 { margin-top: 10px; }
}
@media screen and (max-width:640px) {
  section { padding: 3vw 0 2vw; }
  section .title_box { margin-top: 20px; }
  #about_area { background: white; }
  #productBox { padding: 10vw 5vw; }
  #productBox .productinfo ul { margin: auto; width: 80%; }
  #productBox .productinfo ul { width: 100%; }
  #productBox .productinfo ul li { margin: 15px 28px; }
  #about_area .info_box article,#about_area2 .info_box article { width: 100%; margin-top: 39px; margin-bottom: 20px; }
  #book_area .list_box img { height: 65vw; }
  #post_box a.boomlink { border: none; width: auto; }
  #post_box a.boomlink span { display: none; }
  #post_box .Jlinkbum ul li .Jbinfo { padding: 15px 15px; }
  section .title_box2 .sub_title:before { width: 137px; }
}
@media screen and (max-width:480px) {
  footer #flogo #about_area:after { display: none; }
  #photo_list:before { width: 80%; border-radius: 0px 0px 0px 31px; }
  #product_area .bgBox { width: 100%; object-fit: cover; }
  #about_area2 { margin-top: 10px; }
  #about_area:before { height: 120px; bottom: -2%; }
  .mapotext { padding: 2px 0; }
  a.boomlink svg { width: 12px; }
  a.boomlink { width: 145px; padding: 5px 5px; }
  .mapotext .workframe img { width: 28px; }
  #art_box .art_textbox { margin-top: 107px; }
  #art_box { padding: 77px 0 20px; }
  section .title_box2 .area_title { top: -18px; font-size: 38px; }
  #post_box { padding-bottom: 35px; }
  #about_area .workframe:before { background: #cdcdcd; right: -26px; }
  section .title_box:before { width: 100vw; right: -29px; margin-left: 0; }
  #productBox .titleBox { display: flex; flex-direction: column; align-items: flex-start; margin-bottom: 66px; padding: 0 22px; }
  #productBox .titleBox:before { content: ""; position: absolute; height: 1px; background: rgb(155 155 155/55%); bottom: -20px; z-index: 0; width: 101vw; right: -21px; margin-left: 0; }
  #productBox:before { display: none; }
  #productBox .productinfo:after { content: ""; position: absolute; width: 1px; height: 125px; background: #c7c7c7; right: -6px; top: -43px; z-index: 0; }
  section#news_area:before { display: none; }
  #productBox .more { margin-bottom: 20px; }
  #news_area .bg_box:before { display: none; }
  section#news_area { padding-top: 25px; }
  #news_area .omgnw_list .list_box { width: 100%; display: flex; flex-direction: column; }
  #news_area .omgnw_list .list_box .slick-slider { width: 90%; }
  #news_area .omgnw_list .list_box:before { display: none; }
  #news_area .list_box .info_box h3 { font-weight: 400; }
  #productBox .productinfo ul li .img { margin: 10px 0; border-radius: 25px 20px 0 0; }
  #productBox .productinfo ul li .info .tt { border-radius: 0 0 25px 20px; padding: 12px 10px; }
  #news_area .omgnw_list .list_box ul li .cage a { padding: 5px 20px; }
  #news_area .omgnw_list .list_box ul li .cage { top: -17px; }
  .flypanme { margin-top: -14px; width: min(920px,100%); }
}
