@import url('/css/community.css');

/* #faq_list */
#faq_list li .title i {transform:rotate(0);-webkit-transform:rotate(0);transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out}
#faq_list li.current .title i {transform:rotate(180deg);-webkit-transform:rotate(180deg)}

/* #book_list */
#book_list li .img_box:before,#book_list li .img_box:after {transform:scaleY(0);-webkit-transform:scaleY(0)}
#book_list li .img_box:after {transform-origin:center bottom;-webkit-transform-origin:center bottom}
[data-action="loader"] .loader_circle {width:50px;height:50px;border-radius:50%}

/* #lodbg */
[data-action="loader"]#lodbg .loader_circle {-webkit-animation:circle infinite 0.75s linear;animation:circle infinite 0.75s linear}
@keyframes circle{0%{transform:rotate(0);-webkit-transform:rotate(0)}100%{transform:rotate(360deg);-webkit-transform:rotate(360deg)}}
@-webkit-keyframes circle{0%{transform:rotate(0);-webkit-transform:rotate(0)}100%{transform:rotate(360deg);-webkit-transform:rotate(360deg)}}
header .menu {background:var(--white)}

/* #menubtn */
header #menubtn[data-type="1"] a span {background:var(--secondary)}

/* #wrap */
#wrap {z-index:6}
#wrap .page_area {margin:auto;width:100%;z-index:2}
#wrap .shadow {box-shadow:0 0 20px rgba(var(--black-rgb),.2)}

/* #page_title */
#page_title.page_area,#sub_banner .page_area {width:100%;max-width:100%}

/* #sub_banner */
#sub_banner {top:0; left:0}
#sub_banner a,#page_title {padding-top:70px; height:400px}
#sub_banner a img {height:100%}
#sub_banner a:after {position:absolute;width:100%;height:100%;top:0;left:0;z-index:2;content:"";background:linear-gradient(to bottom,rgb(227 234 243 / 17%),rgb(255 255 255))}

/* #page_title */
#page_title:before {content:"";position:absolute;width:1px;height:45px;margin:24px auto;background:linear-gradient(180deg,#79a7ba,rgba(121,167,186,0));bottom:20px;left:calc(50% - 1px)}
#page_title>div {margin:auto}
#page_title .pag_tit {line-height:1.3em;letter-spacing:.15em;font-size:2em;color:#cb9917;font-family: "IBM Plex Sans JP", sans-serif;}
.waylink ol {padding-top:5px}
.waylink ol li,.waylink ol li a {letter-spacing:1.5px;font-weight:300;font-size:13px;vertical-align:bottom;color:#565656}
.waylink ol li:after {margin:0 10px;display:inline-block;font-weight:100;font-size:12px;color:#565656;content:"/"}
.waylink ol li:last-child:after {margin:0; content:""}
.page_area {position:relative;width:88%;max-width:1380px;margin:0 auto 65px;z-index:5}

/* #category_nav */
#category_nav {position:relative;margin:0;padding:0;display:flex;align-items:center;justify-content:center;gap:0;border-bottom:1px solid rgba(46,111,140,.14);-webkit-transition:all 0s ease-in-out}
#category_nav>li {position:relative;list-style:none}
#category_nav>li>.category_nav_head {position:relative;display:flex;align-items:center;justify-content:center;-webkit-transition:all 0s ease-in-out}
#category_nav>li>.category_nav_head>a {position:relative;padding:19px 27px;color:#6b818b;font-size:16px;font-weight:400;line-height:1.5;letter-spacing:.05em;white-space:nowrap;transition:.35s ease}
#category_nav>li>.category_nav_head>a:after {content:"";position:absolute;left:50%;bottom:-1px;width:0;height:2px;background:#438eae;transform:translateX(-50%);transition:.35s ease}
#category_nav>li:hover>.category_nav_head>a,#category_nav>li.active>.category_nav_head>a,#category_nav>li.current>.category_nav_head>a,#category_nav>li.on>.category_nav_head>a,#category_nav>li.action a {color:#155b78}
#category_nav>li:hover>.category_nav_head>a:after,#category_nav>li.active>.category_nav_head>a:after,#category_nav>li.current>.category_nav_head>a:after,#category_nav>li.on>.category_nav_head>a:after,#category_nav>li.action a:after {width:100%}
.category_sub_toggle {display:none}
.category_mobile_head {display:none}
#category_nav>li>ul,#category_nav>li>.sub_list,#category_nav>li>.menu_body,#category_nav>li>.sub_category {position:absolute;left:50%;top:100%;min-width:190px;margin:0;padding:10px 0;background:rgba(255,255,255,.98);border:1px solid rgba(67,134,164,.12);box-shadow:0 15px 40px rgba(28,73,92,.1);opacity:0;visibility:hidden;transform:translate(-50%,10px);transition:.35s ease;z-index:20}
#category_nav>li:hover>ul,#category_nav>li:hover>.sub_list,#category_nav>li:hover>.menu_body,#category_nav>li:hover>.sub_category {opacity:1;visibility:visible;transform:translate(-50%,0)}
#category_nav>li>ul li,#category_nav>li>.sub_list li,#category_nav>li>.menu_body li,#category_nav>li>.sub_category li {position:relative;display:block;list-style:none;text-align:left}
#category_nav>li>ul a,#category_nav>li>.sub_list a,#category_nav>li>.menu_body a,#category_nav>li>.sub_category a {position:relative;display:block;padding:11px 20px;color:#71858e;font-size:16px;line-height:1.5;white-space:nowrap;transition:.3s ease}
#category_nav>li>ul a:hover,#category_nav>li>.sub_list a:hover,#category_nav>li>.menu_body a:hover,#category_nav>li>.sub_category a:hover {padding-left:25px;color:#216c8b;background:rgba(235,246,250,.7)}
.list_box li {margin:0 15px 50px}
.list_box li img {background:rgba(var(--primary-rgb),.05)}
.product_list_page {position:relative;padding:0;overflow:hidden}
.product_list_page:before {content:"PRODUCT";position:absolute;left:50%;top:55px;color:rgba(59,137,170,.035);font-family:"Times New Roman",serif;font-size:145px;line-height:1;letter-spacing:.1em;transform:translateX(-50%);white-space:nowrap;pointer-events:none}
.product_list_intro {position:relative;max-width:840px;margin:-10px auto 65px;text-align:center}
.product_list_intro_en {margin-bottom:12px;color:#80a8b9;font-family:"Times New Roman",serif;font-size:16px;line-height:1.4;letter-spacing:.16em}
.product_list_intro_text {color:#667b84;font-size:16px;line-height:2;letter-spacing:.035em}

/* #product_list */
#product_list {position:relative;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:65px 34px;counter-reset:productNo}
#product_list>li {position:relative;min-width:0;list-style:none;counter-increment:productNo;background:#fff;margin:0}
#product_list>li .masklink {position:absolute;left:0;top:0;width:100%;height:100%;z-index:8}
.product_list_pic {position:relative;overflow:hidden;background:#f3f7f9}
.bop_img {position:relative;width:100%;overflow:hidden}
.bop_img:after {content:"";position:absolute;left:0;top:0;width:100%;height:100%;border:1px solid rgba(45,112,142,.1);pointer-events:none;z-index:2}
.bop_img img {display:block;width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .8s cubic-bezier(.22,1,.36,1),filter .6s ease}
#product_list>li:hover .bop_img img {transform:scale(1.045)}
.product_list_no {position:absolute;left:20px;top:20px;width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;background:rgba(22,84,110,.82);backdrop-filter:blur(5px);font-family:"Times New Roman",serif;font-size:16px;line-height:1;letter-spacing:.04em;z-index:3}
.product_list_no:before {content:counter(productNo,decimal-leading-zero)}
.product_list_view {position:absolute;right:20px;bottom:18px;padding:9px 14px;display:flex;align-items:center;gap:10px;color:#fff;background:rgba(15,78,105,.78);backdrop-filter:blur(5px);font-family:"Times New Roman",serif;font-size:16px;line-height:1;letter-spacing:.1em;opacity:0;transform:translateY(8px);transition:.4s ease;z-index:3}
.product_list_view i {position:relative;width:21px;height:1px;background:#fff}
.product_list_view i:after {content:"";position:absolute;right:0;top:-3px;width:6px;height:6px;border-top:1px solid #fff;border-right:1px solid #fff;transform:rotate(45deg)}
#product_list>li:hover .product_list_view {opacity:1;transform:translateY(0)}
.product_list_view span {color:white;font-size:12px}
.product_list_info {position:relative;padding:25px 5px 0}
.product_list_info_top {display:flex;align-items:center;justify-content:space-between;gap:20px}
.product_list_category {color:#83a9b9;font-family:"Times New Roman",serif;font-size:16px;line-height:1.4;letter-spacing:.14em}
.product_list_arrow {position:relative;width:32px;height:20px;display:flex;align-items:center;justify-content:flex-end}
.product_list_arrow i {position:relative;width:23px;height:1px;background:#6d9daf;transition:.4s ease}
.product_list_arrow i:after {content:"";position:absolute;right:0;top:-3px;width:7px;height:7px;border-top:1px solid #6d9daf;border-right:1px solid #6d9daf;transform:rotate(45deg)}
#product_list>li:hover .product_list_arrow i {width:31px;background:#287b9f}
.product_list_name {margin-top:10px;color:#174f68;font-size:23px;font-weight:500;line-height:1.55;letter-spacing:.055em;height:auto}
.product_list_desc {margin-top:11px;color:#70838b;font-size:16px;line-height:1.85;letter-spacing:.025em;-webkit-line-clamp:2}
.product_list_line {position:relative;margin-top:22px;width:100%;height:1px;background:rgba(48,110,138,.14);overflow:hidden}
.product_list_line span {position:absolute;left:0;top:0;width:0;height:1px;background:#428daE;transition:width .6s cubic-bezier(.22,1,.36,1)}
#product_list>li:hover .product_list_line span {width:100%}

/* #article_list */
#article_list li h3 {padding:10px 20px; width:calc(90% - 40px); height:34px; background:rgba(var(--white-rgb),.9); line-height:37px; font-weight:400; font-size:20px; bottom:20px; left:5%}
#article_list li img {height:35vw}
#article_list li .info_box {padding:30px; width:calc(100% - 100px); background:rgba(var(--white-rgb),.9); bottom:-100%; left:20px; opacity:0}
#article_list li .info_box p {height:34px; font-size:20px}
#article_list li .info_box .cate {z-index:2}
#article_list li .info_box article {margin:15px 0 40px; height:90px; line-height:220%; font-weight:300; font-size:14px; -webkit-line-clamp:3}

/* #faq_list */
#faq_list li {margin-bottom:30px}
#faq_list li .title font {padding:15px 65px 15px 25px; background:var(--white); font-size:18px; box-shadow:0 0 15px rgba(var(--black-rgb),.2)}
#faq_list li .title i {font-size:26px; top:calc((100% - 26px) / 2); right:25px}
#faq_list li .info {padding:25px; font-size:14px; -webkit-transition:none; -moz-transition:none; -ms-transition:none; -o-transition:none; transition:none}
#faq_list li.current {box-shadow:0 0 15px rgba(var(--black-rgb),.2)}
#faq_list li.current .title font {background:var(--gray); box-shadow:none; color:var(--white)}
#faq_list li.current .title i {color:var(--white)}

/* #book_list */
#book_list img {height:450px}
#book_list .img_box {border:var(--white) solid; border-width:0 1px 1px 0}
#book_list .img_box:before,#book_list .img_box:after {position:absolute; width:100%; height:100%; background:var(--white); z-index:9; opacity:.4; content:""}
#book_list .img_box:after {right:0; bottom:0}
#book_list .atag_item {z-index:10}
#book_list .badge {margin:auto; padding:10px 20px; max-width:calc(80% - 40px); height:34px; line-height:36px; font-size:20px}

/* #album_list */
#album_list {flex-wrap:wrap}
#album_list>div {margin:0 1px 1px 0; height:300px; flex-grow:1}
#album_list>div img {width:auto; min-width:100%; height:300px}

/* #content_wrap */
#content_wrap {padding:5vw 0; z-index:1}
#content_wrap h1 {margin-bottom:5px; padding:0 20px 5px; border-bottom:1px rgba(var(--black-rgb),.1) solid; line-height:130%}
#content_wrap .top_box {padding: 0;}
#content_wrap .quote_box {margin-right:30px}

/* #pagenav */
#pagenav {padding-top:50px}
#pagenav a,#pagenav strong {margin:0 2px; width:35px; height:35px; background:rgba(var(--black-rgb),.1); border-radius:5px; display:inline-block; text-align:center; line-height:35px; font-weight:400}
#pagenav strong {background:var(--primary); color:var(--white)}
#pagenav a:first-child,#pagenav a:last-child {line-height:30px}
#pagenav p a {margin:0; padding:0 20px; width:auto; border-radius:20px}
#pagenav p a i {margin:0 5px 0 0}
#pagenav p a font {-webkit-transition:none; -moz-transition:none; -ms-transition:none; -o-transition:none; transition:none}
#pagenav p:last-child a i {margin:0 0 0 5px}

/* #describe */
#describe {margin:2em 0 5vw}
#describe * {vertical-align:bottom}
.form_box {display:grid; grid-template-columns:repeat(2,1fr); gap:20px 30px}
.form_box p.large {grid-column:1/3}
.form_box p.note {margin-bottom:20px}

/* #btnOK */
.form_box p #btnOK {width:150px}
[data-action="loader"] {width:100vw; height:100vh; background:rgba(var(--black-rgb),.3); line-height:100vh; top:0; left:0; opacity:0; z-index:-1}
[data-action="loader"] .loader_circle {border:2px rgba(var(--black-rgb),.6) solid; border-left-color:rgba(var(--white-rgb),.4)}

/* #lodbg */
#lodbg {opacity:1; z-index:99999}
.news_detail_page {position:relative;padding:0;overflow:hidden}
.news_detail_page:before {content:"NEWS";position:absolute;left:50%;top:55px;color:rgba(59,137,170,.035);font-family:"Times New Roman",serif;font-size:145px;line-height:1;letter-spacing:.12em;transform:translateX(-50%);white-space:nowrap;pointer-events:none}
.news_article {position:relative;width:88%;max-width:1100px;margin:0 auto}
.news_article_head {position:relative;margin-bottom:38px;text-align:center}
.news_article_en {margin-bottom:10px;color:#82a9b9;font-family:"Times New Roman",serif;font-size:16px;line-height:1.4;letter-spacing:.18em}
.news_article_title {color:#174f68;font-family:"Noto Serif TC","Times New Roman",serif;font-size:32px;font-weight:500;line-height:1.55;letter-spacing:.05em}
.news_article_line {margin:20px auto 0;display:flex;align-items:center;justify-content:center;gap:8px}
.news_article_line span {display:block;width:52px;height:2px;background:#5095b3}
.news_article_line i {display:block;width:6px;height:6px;border-radius:50%;background:#9abfce}
.nwes_info {position:relative}
.nwes_info .top_box {position:relative;margin-bottom:48px;padding:17px 0;border-bottom:1px solid var(--inner-line);display:flex;align-items:center;justify-content:space-between;gap:30px}
.nwes_info .quote_box {color:#7a8d95;font-size:16px;line-height:1.6}
.nwes_info .quote_box span {color:#91a5ae}
.nwes_info .quote_box a {color:#327b9b;transition:.3s ease}
.nwes_info .quote_box a:hover {color:#155875}
.nwes_info .time {margin:0;color:#6d828c;font-family:"Times New Roman",serif;font-size:16px;line-height:1.4;letter-spacing:.08em;white-space:nowrap;padding:10px 0}
.nwes_info .time span {margin-right:10px;color:#9ab0ba;letter-spacing:.15em}
.news_list_page {position:relative;padding:0;overflow:hidden}
.news_list_page:before {content:"NEWS";position:absolute;left:50%;top:55px;color:rgba(59,137,170,.035);font-family:"Times New Roman",serif;font-size:145px;line-height:1;letter-spacing:.12em;transform:translateX(-50%);white-space:nowrap;pointer-events:none}
.news_list_intro {position:relative;max-width:820px;margin:-10px auto 65px;text-align:center}
.news_list_intro_en {margin-bottom:12px;color:#82a9b9;font-family:"Times New Roman",serif;font-size:16px;line-height:1.4;letter-spacing:.16em}
.news_list_intro_text {color:#667b84;font-size:16px;line-height:2;letter-spacing:.035em}

/* #news_list */
#news_list {position:relative;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:65px 34px}
#news_list>li {position:relative;min-width:0;list-style:none;background:#fff}
#news_list .masklink {position:absolute;left:0;top:0;width:100%;height:100%;z-index:8}
.news_list_pic {position:relative;width:100%;background:#f3f7f9}
.news_list_pic:after {content:"";position:absolute;left:0;top:0;width:100%;height:100%;border:1px solid rgba(46,111,140,.1);pointer-events:none;z-index:2}
.news_list_pic img {display:block;width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .8s cubic-bezier(.22,1,.36,1),filter .5s ease}
#news_list>li:hover .news_list_pic img {transform:scale(1.045)}
.news_list_view {position:absolute;right:18px;bottom:18px;padding:9px 14px;display:flex;align-items:center;gap:10px;color:#fff;background:rgba(17,79,105,.78);backdrop-filter:blur(5px);font-family:"Times New Roman",serif;font-size:16px;line-height:1;letter-spacing:.09em;opacity:0;transform:translateY(8px);transition:.4s ease;z-index:3}
.news_list_view span {font-size:12px;color:white}
.news_list_view i {position:relative;width:20px;height:1px;background:#fff}
.news_list_view i:after {content:"";position:absolute;right:0;top:-3px;width:6px;height:6px;border-top:1px solid #fff;border-right:1px solid #fff;transform:rotate(45deg)}
#news_list>li:hover .news_list_view {opacity:1;transform:translateY(0)}
#news_list .info_box {position:relative;padding:23px 5px 0}
.news_list_meta {display:flex;align-items:center;justify-content:space-between;gap:20px}
.news_list_category {position:relative;z-index:9;max-width:60%;color:#4386a3;font-size:16px;line-height:1.5;letter-spacing:.05em;transition:.3s ease;height:auto}
.news_list_category:hover {color:#155c7a}
.news_list_time {flex:0 0 auto;color:#91a3ab;font-family:"Times New Roman",serif;font-size:16px;line-height:1.4;letter-spacing:.06em}
.news_list_title {margin-top:13px;color:#174f68;font-size:22px;font-weight:500;line-height:1.65;letter-spacing:.045em;-webkit-line-clamp:2;height:auto}
.news_list_bottom {position:relative;margin-top:22px;height:1px;background:rgba(46,111,140,.14);overflow:visible}
.news_list_bottom span {position:absolute;left:0;top:0;width:0;height:1px;background:#4e96b5;transition:width .6s cubic-bezier(.22,1,.36,1)}
.news_list_bottom i {position:absolute;right:0;top:-4px;width:8px;height:8px;border-top:1px solid #7fa7b8;border-right:1px solid #7fa7b8;transform:rotate(45deg);opacity:.55;transition:.35s ease}
#news_list>li:hover .news_list_bottom span {width:100%}
#news_list>li:hover .news_list_bottom i {right:-4px;opacity:1}

/* @media */
@media screen and (max-width:1200px) {
  .product_list_page:before { font-size: 115px }
  #product_list { gap: 55px 28px }
  .product_list_name { font-size: 21px }
  .news_detail_page:before { font-size: 115px }
  .news_article { width: 92% }
  .news_article_title { font-size: 29px }
  .news_list_page:before { font-size: 115px }
  #news_list { gap: 55px 28px }
  .news_list_title { font-size: 21px }
}
@media screen and (max-width:1024px) {
  .form_box { grid-template-columns: 1fr }
  .form_box p.large { grid-column: inherit }
}
@media screen and (max-width:991px) {
  .page_area { width: 90%; margin-bottom: 50px }
  #product_list { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 50px 28px }
  .product_list_intro { margin-bottom: 55px }
  .news_article { width: 100% }
  #news_list { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 50px 28px }
  .news_list_intro { margin-bottom: 55px }
}
@media screen and (max-width:768px) {
  #article_list li img { height: 50vw }
}
@media screen and (max-width:767px) {
  .page_area { width: calc(100% - 40px); margin-bottom: 45px }
  .category_mobile_head {/* display: block; */}
  .category_mobile_toggle { position: relative; width: 100%; height: 54px; padding: 0 18px; border: 1px solid rgba(55,126,156,.2); display: flex; align-items: center; justify-content: space-between; color: #285f76; background: #fff; font-size: 15px; font-weight: 500; line-height: 1; letter-spacing: .05em; text-align: left }
  .category_mobile_toggle i { position: relative; width: 15px; height: 15px }
  .category_mobile_toggle i:before,.category_mobile_toggle i:after { content: ""; position: absolute; left: 50%; top: 50%; background: #4d8da8; transform: translate(-50%,-50%); transition: .3s ease }
  .category_mobile_toggle i:before { width: 15px; height: 1px }
  .category_mobile_toggle i:after { width: 1px; height: 15px }
  .category_mobile_toggle.is-open i:after { height: 0 }
  #category_nav.is-open { display: block }
  #category_nav>li { width: 100%; border-bottom: 1px solid rgba(46,111,140,.1) }
  #category_nav>li:last-child { border-bottom: 0 }
  #category_nav>li>.category_nav_head {min-height: 52px;}
  #category_nav>li>.category_nav_head>a {width: 100%;padding: 14px 17px;color: #647a84;font-size: 15px;white-space: normal;text-align: center;}
  #category_nav>li>.category_nav_head>a:after { display: none }
  #category_nav>li.active>.category_nav_head>a,#category_nav>li.current>.category_nav_head>a,#category_nav>li.on>.category_nav_head>a { color: #155d7a; font-weight: 500 }
  .category_sub_toggle { position: absolute; right: 0; top: 0; width: 52px; height: 52px; padding: 0; border: 0; display: none; background: transparent; z-index: 5 }
  #category_nav>li.has-sub>.category_nav_head>.category_sub_toggle { display: block }
  .category_sub_toggle i { position: absolute; left: 50%; top: 50%; width: 15px; height: 15px; transform: translate(-50%,-50%) }
  .category_sub_toggle i:before,.category_sub_toggle i:after { content: ""; position: absolute; left: 50%; top: 50%; background: #6a99ad; transform: translate(-50%,-50%); transition: .3s ease }
  .category_sub_toggle i:before { width: 15px; height: 1px }
  .category_sub_toggle i:after { width: 1px; height: 15px }
  #category_nav>li.is-open>.category_nav_head>.category_sub_toggle i:after { height: 0 }
  #category_nav>li>ul,#category_nav>li>.sub_list,#category_nav>li>.menu_body,#category_nav>li>.sub_category { position: relative; left: auto; top: auto; width: 100%; min-width: 0; margin: 0; padding: 0; background: #f7fafb; border: 0; border-top: 1px solid rgba(46,111,140,.08); box-shadow: none; opacity: 1; visibility: visible; transform: none; display: none }
  #category_nav>li.is-open>ul,#category_nav>li.is-open>.sub_list,#category_nav>li.is-open>.menu_body,#category_nav>li.is-open>.sub_category { display: block }
  #category_nav>li>ul li,#category_nav>li>.sub_list li,#category_nav>li>.menu_body li,#category_nav>li>.sub_category li { border-bottom: 1px solid rgba(46,111,140,.07) }
  #category_nav>li>ul li:last-child,#category_nav>li>.sub_list li:last-child,#category_nav>li>.menu_body li:last-child,#category_nav>li>.sub_category li:last-child { border-bottom: 0 }
  #category_nav>li>ul a,#category_nav>li>.sub_list a,#category_nav>li>.menu_body a,#category_nav>li>.sub_category a { padding: 12px 18px 12px 32px; color: #71868f; font-size: 15px; white-space: normal }
  #category_nav>li>ul a:before,#category_nav>li>.sub_list a:before,#category_nav>li>.menu_body a:before,#category_nav>li>.sub_category a:before { content: ""; position: absolute; left: 18px; top: 50%; width: 5px; height: 1px; background: #7da7b9 }
  #category_nav>li>ul a:hover,#category_nav>li>.sub_list a:hover,#category_nav>li>.menu_body a:hover,#category_nav>li>.sub_category a:hover { padding-left: 32px }
  .product_list_page { padding-top: 65px }
  .product_list_page:before { top: 48px; font-size: 73px }
  .product_list_intro { margin: -5px auto 45px }
  .product_list_intro_en { font-size: 15px }
  .product_list_intro_text { font-size: 15px; line-height: 1.9 }
  #product_list { grid-template-columns: 1fr; gap: 45px }
  .product_list_no { left: 15px; top: 15px; width: 46px; height: 46px; font-size: 15px }
  .product_list_view { display: none }
  .product_list_info { padding-top: 20px }
  .product_list_category { font-size: 15px }
  .product_list_name { margin-top: 8px; font-size: 20px }
  .product_list_desc { margin-top: 8px; font-size: 15px; line-height: 1.8 }
  .product_list_line { margin-top: 18px }
  .news_detail_page { padding-top: 65px }
  .news_detail_page:before { top: 48px; font-size: 73px }
  .news_article_head { margin-bottom: 30px }
  .news_article_en { font-size: 15px }
  .news_article_title { font-size: 25px }
  .nwes_info .top_box { margin-bottom: 38px; display: block }
  .nwes_info .quote_box { display: block; font-size: 15px }
  .nwes_info .time { display: block; margin-top: 10px; font-size: 15px }
  .news_list_page { padding-top: 65px }
  .news_list_page:before { top: 48px; font-size: 73px }
  .news_list_intro { margin: -5px auto 45px }
  .news_list_intro_en { font-size: 15px }
  .news_list_intro_text { font-size: 15px; line-height: 1.9 }
  #news_list { grid-template-columns: 1fr; gap: 45px }
  .news_list_view { display: none }
  #news_list .info_box { padding-top: 19px }
  .news_list_category { font-size: 15px }
  .news_list_time { font-size: 15px }
  .news_list_title { margin-top: 10px; font-size: 20px }
  .news_list_bottom { margin-top: 18px }
}
@media screen and (max-width:640px) {
  #article_list li img { height: 320px }
  #book_list { margin: 0 5% }
  #book_list .img_box { border: 0 }
  #book_list img { height: 65vw }
  #album_list>div,#album_list>div img { height: 40vw }
}
@media screen and (max-width:550px) {
  #community { margin-top: 10px }
  #pagenav p a i,#pagenav p:last-child a i { margin: 0 }
}
@media screen and (max-width:500px) {
  .page_area { width: calc(100% - 30px) }
  #sub_banner a,#page_title { height: 250px }
  #page_title:before { display: none }
  .product_list_page:before { font-size: 53px }
  .product_list_name { font-size: 19px }
  .news_detail_page:before { font-size: 53px }
  .news_article_title { font-size: 23px }
  .news_list_page:before { font-size: 53px }
  .news_list_meta { align-items: flex-start; gap: 12px }
  .news_list_category { max-width: 58% }
  .news_list_title { font-size: 19px }
}
@media screen and (max-width:450px) {
  #album_list>div,#album_list>div img { height: 50vw }
  #pagenav a,#pagenav strong { margin: 0; width: 24px; height: 24px; line-height: 24px; font-size: 14px }
  #pagenav a:first-child,#pagenav a:last-child { line-height: 20px }
  #pagenav p a i,#pagenav p:last-child a i { font-size: 20px }
}
@media screen and (min-width:1281px) {
  #book_list li:hover .img_box:before,#book_list li:hover .img_box:after { transform: scaleY(1); -webkit-transform: scaleY(1) }
  #sub_banner a,#page_title { padding-top: 0; height: 400px }
  #article_list li:hover h3 { opacity: 0 }
  #article_list li img { height: 500px }
  #article_list li:hover .info_box { bottom: 20px; opacity: 1 }
  #book_list li:hover .badge { background: var(--primary); color: var(--white) }
  #pagenav a:hover { background: var(--primary); color: var(--white) }
  #pagenav a:hover font,#pagenav a:hover i,#pagenav a:hover i:before { color: var(--white) }
}