/* CSS Document */

body {	-webkit-text-size-adjust:100%; font-family: 'Noto Sans TC', sans-serif; overflow-x: hidden; position: relative;}
img {	border:0; }

/* Reset ================================================================================= */

a { text-decoration:none; transition: all 0.4s ease-out 0s; }
a:hover { text-decoration:none; }

* { box-sizing: border-box;}

.content-Box { max-width:1280px; width: 100%; margin:0 auto; text-align:left; position:relative; clear:both;}

#content { font-size: 18px; line-height:30px; color: #333; letter-spacing: 0.05rem; font-weight: 400; overflow: hidden;}
#content p{ margin-bottom: 30px; margin-top: 0; font-size: 18px;line-height:30px;  font-weight: 400;}
p, td, li, label { font-size: 18px;line-height:30px;  font-weight: 400;}

.photo-fit img { object-fit: cover; width: 100%; height: 100%; position: absolute; z-index: 1; left: 0; top: 0;}

.photo {line-height: 0; height: 0; padding-bottom: 40%; overflow: hidden; position: relative; z-index: 1; margin-bottom: 0px;}
.imgCenter {position: absolute; top: 0; left: 0; right: 0; bottom: 0; line-height: 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; z-index: 2;}
.imgCenter img {max-height: 100%;}

.demo-section { padding-left: 5%; padding-right: 5%;}

.banner { position: relative; }
.banner img { width: 100%;}

.banner-pc img { object-fit: cover; width: 100%; height: 100%;}
.banner-pc { height: 310px;}
.banner-mobile { display: none;}

.main-bg {padding-top: 52px; 
background-image: url("../images/main-bg-1.png"), url("../images/main-bg-2.png");
background-position: top left, right bottom;
background-repeat: no-repeat, no-repeat;
background-size: 65%, 33%;
}

.title01 { position: relative; padding-bottom: 8px; }
.title01:before { position: absolute; content: ""; width: 26px; height: 15px; background: url("../images/title-icon-2.png"); background-size: contain; top:-15px; left: -26px;}
.title01 > h1, .title01 > div { margin: 0; padding: 5px 0 0 0; line-height: 110%; font-size: 30px; font-weight: 500; color: #11325d;}

#path { text-align: left; position: relative; padding: 0 0 18px 0; }
#path ul { margin: 0; padding: 0; }
#path li { display: inline-block; vertical-align: top; font-size: 14px; line-height: 24px; letter-spacing: 0.05rem;}
#path li:after { content:">"; display: inline-block; vertical-align: top; padding: 0 0 0 4px;}
#path li:last-child { pointer-events: none;}
#path li:last-child:after { display: none;}
#path li a { color: #333; }
#path li a:hover { color: #333; opacity: 0.5;}
#path li:last-child a { color: #333;}

aside { display: flex; flex-direction: row; flex-wrap: wrap; justify-content:center; padding-bottom: 30px;}
aside > a { display: inline-block; padding: 4px 20px; font-size: 18px; position: relative;}
aside > a:after { content: ""; position: absolute; top: 0; right: 0; width: 1px; height: 100%; background: #b3b3b3;}
aside > a:last-child:after { display: none;}
aside > a:hover, aside > a.current { color: #eb9e16; font-size: 24px;}

/*news*/
.news-focus-section { padding-bottom: 60px; display:flex; flex-direction: row; flex-wrap: wrap; align-items: center;}
.news-focus-section > div { width: 50%;}
.news-focus-section > div:nth-of-type(1) { padding-right: 7%;}
.news-focus-section > div:nth-of-type(2) { padding-left: 22px;}
.news-date { position: relative; padding-left: 30px; margin-bottom: 26px; line-height: 100%; font-size: 16px;}
.news-date:before { position: absolute; content: ""; background: #919191; width: 20px; height: 1px; left: 0; top:8px;}
.news-title { font-size: 40px; font-weight: 300; line-height: 125%; display: block;}
.news-title:hover{ color: #eb9e16;}
.news-pto{ padding-bottom: 68.5%; display: block;}

.news-list-section { display:flex; flex-direction: row; flex-wrap: wrap; margin-right: -40px;}
.news-list-section > div { padding-bottom: 60px; margin-right: 40px; width: calc(33.33% - 40px);}
.news-title-s { font-size: 18px !important; font-weight: 400; line-height: 150%;}
.news-pto-s { margin-bottom: 22px;}

#page { text-align: center; padding:0 0 60px 0;}
#page a { font-size: 16px; color: #000; font-weight: 400; width: 30px; height: 30px; line-height: 28px; text-align: center; border-radius: 100%; display: inline-block;}
#page a:hover, #page a.current { background: #eb9e16; color: #fff;}
.page-prev, .page-next { width: 12px !important; height: 12px !important; line-height: inherit !important; border-radius: 0 !important; border-top:1px solid #000; border-right: 1px solid #000; margin: 0 20px;}
.page-prev:hover, .page-next:hover { background: none !important;}
.page-prev { transform: rotate(-135deg);}
.page-next { transform: rotate(45deg);}

/*news-detail*/
.news-detail-section { display: flex; flex-direction: row; flex-wrap: wrap; padding-bottom: 40px; }
.news-detail-section > div:nth-of-type(1) { width: calc(100% - 292px); padding-right:120px; }
.news-detail-section > div:nth-of-type(2) { width: 292px; }
.news-detail-date { font-size: 16px !important; color: #333 !important; font-weight: 400 !important;}

.social-tool { text-align: left; padding-bottom: 30px;}

.news-detail-pto { max-width: 800px; margin: 0 auto; text-align:left; padding-bottom: 35px;}
.news-detail-pto span { display: block; font-size: 14px; color: #888888; line-height: 160%; padding-top: 10px;}

.btn02 { width: 84px; height: 84px; border-radius: 100%; margin: 0 auto 40px auto; background: #11325d; color: #fff !important; font-size: 16px; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center;}
.btn02:hover { transform: scale(0.9);}

.blog-aside-title { margin-bottom: 20px; position: relative;}
.blog-aside-title span { font-size: 30px; color: #333; line-height: 120%; padding: 0; margin: 0; font-weight: 700;}
.blog-aside-title:after { content: ""; position: absolute; background:url("../images/icon-type-2.png"); width: 52px; height: 45px; background-size: contain; left: -52px; top: -22px;}

.blog-aside {  padding-bottom: 44px;}
.blog-aside > a { display: block; border-bottom: 1px solid #b9b9b9; padding: 0 0 14px; margin-bottom: 14px;color: #333 !important; font-weight: 400;}
.blog-aside > a:hover, .blog-aside > a.current { color: #eb9e16 !important;}

/*class*/
/*.class-list { display: flex; flex-direction: column; flex-wrap: wrap;}*/
.class-list > div { display: flex; flex-direction: row; flex-wrap: wrap; margin-bottom: 30px; background: #f8f8f8;}
.class-list > div:last-child { margin-bottom: 60px;}
.class-list > div > div { width: 50%;}
.class-list > div > div:nth-of-type(1) { padding: 5% 9% 0 9%; line-height: 180%;}
.class-title { position: relative; font-size: 24px; font-weight: 700; margin-bottom: 30px; display: block; padding: 5px 0;}
.class-title:hover { color: #eb9e16;}
.class-title:before { position: absolute; content: ""; left: -38px; top: 0; width:6px; height: 100%; background: #eb9e16;}
.class-data { font-size: 16px; line-height: 24px;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;}

.class-pto { padding-bottom: 61.5%; display: block;}

/*about*/
.about-section-1 { position: relative;}
.about-section-1:after { position: absolute; content: ""; width: 28%; height: calc(100% + 276px); top: -276px; right: 0; background: #eb9e16; transform:skewX(-35deg);}
.about-section-1-box { position: relative; z-index: 2; display: flex; flex-direction: row; flex-wrap: wrap; margin-bottom: 60px;}
.about-section-1-box > div { width: 50%;}
.about-section-1-box > div:nth-of-type(1) { padding-left: 5%;}
.about-section-1-box > div:nth-of-type(2) { padding: 0px 5% 0 5%;}
.about-section-1-content { max-width: 640px; margin: 0 0 0 auto;}
.about-title-1 { padding-bottom: 30px; font-weight: 700; font-size: 36px; line-height: 150%;}
.about-title-1 span { display: block; color: #eb9e16; font-weight: 300; font-size: 36px;font-family: 'Noto Serif TC', sans-serif; line-height: 100%; padding-bottom: 10px;}

.about-section-2 { background: url("../images/about-section-2-bg.jpg") no-repeat center center; background-size: cover; padding: 0 5% 80px 5%; overflow:hidden;}
.about-section-2-content { display: flex; flex-direction: row; flex-wrap: wrap; align-items: flex-start;}
.about-section-2-content > div { width: 50%; border-left: 1px solid #eb9e16; padding-left: 68px; padding-right: 30px; padding-top: 70px;}
.about-section-2-title { position: relative; color: #eb9e16; font-size: 30px; font-weight: 500; line-height: 140%;}
.about-section-2-title:before { position: absolute; content: ""; left: -68px; top:22px; width: 45px; height: 1px; background: #eb9e16;}
.about-section-2-data-1 { margin:10px 0 35px 20px; padding: 0; list-style: disc; color: #fff; font-size: 20px;}
.about-section-2-title-2 { margin-bottom: 10px; width: 100%; max-width: 300px; border-radius: 15px 0 15px 0; padding:10px 14px; font-weight: 700; font-size: 20px; color: #fff; background: #eb9e16; margin-top: 12px;}
.about-section-2-data-2 { color: #fff;}

.about-section-3 { /*background: url("../images/about-section-3-bg.png") no-repeat center right; background-size: 52%; */padding: 6% 5%;}
.about-section-3-box { display:flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between;}
.about-section-3-box > div { width: 48.5%;}
.about-section-3-content { }

.about-section-4 { background: url("../images/about-section-4-bg.jpg") no-repeat center right; background-size: cover; padding: 9% 5% 12% 5%;}
.about-section-4-content { display: flex;flex-direction: row; flex-wrap: wrap; justify-content: space-around;}
.about-section-4-content > a { display: block; position: relative; width: 380px; margin: 0 10px 60px 10px; border-radius: 40px; padding-left: 100px; background: #fff; }
.about-section-4-content > a > span { display: flex;flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center; font-size: 24px; font-weight: 700; min-height: 80px;}
.about-section-4-content > a > img { display: block; position: absolute; left: 0; top:-35px; width: 100px;}

/*csr*/
.csr-section-1 { z-index: 3; display: flex;flex-direction: row; flex-wrap: wrap; align-items: center; position: relative;}
.csr-section-1 > div { width: 50%;}
.csr-section-1 > div:nth-of-type(1) { padding-right: 110px;}
.csr-section-1 .csr-button{text-align: right;padding-top: 8%;}
.csr-section-1 .csr-button a{display: inline-block; padding: 12px 30px; background-color: #19486a;color: #fff;border: #eb9e16 2px solid;border-radius: 15px 0 15px 0;}
.csr-section-1 .csr-button a:hover { background-color: #eb9e16; color: #fff;border: #19486a 2px solid;}

.csr-section-2 { margin-top: -165px; padding-top: 225px; position: relative;}
.csr-section-2:before { position: absolute; content: "";background: #eb9e16; width: 250%; height: 48.3%; top: 0; left: -80%; z-index: -1; }
.csr-section-2-title { text-align: center; font-family: 'Noto Serif TC', sans-serif; font-size: 4vw; color: #ffda98; text-transform: uppercase; padding-bottom: 30px;line-height: 130%;}

.csr-section-2-list { display: flex;flex-direction: row; flex-wrap: nowrap; justify-content: center; padding-bottom: 115px;}
.csr-section-2-list > div { max-width: 390px;}
.csr-section-2-list > div:nth-of-type(2) .csr-section-2-data > b { color: #38933f;}
.csr-section-2-list > div:nth-of-type(2) .csr-section-2-data:before { background: #38933f;}
.csr-section-2-list > div:nth-of-type(2) .csr-section-2-data:after { background: #38933f;}
.csr-section-2-list > div:nth-of-type(3) .csr-section-2-data > b { color: #c4192d;}
.csr-section-2-list > div:nth-of-type(3) .csr-section-2-data:before { background: #c4192d;}
.csr-section-2-list > div:nth-of-type(3) .csr-section-2-data:after { background: #c4192d;}
.csr-section-2-data { margin-top: 110px; text-align: center; position: relative;}
.csr-section-2-data > b { display: block; text-align: center; font-size: 25px; font-weight: 700; color: #19486a; line-height: 130%; margin-bottom: 16px;}
.csr-section-2-data:before {  content: ""; position: absolute; width: 35px; height: 35px; border-radius: 100%; background: #19486a; top:-62px; left: calc(50% - 17.5px);}
.csr-section-2-data:after {  content: ""; position: absolute; width: 7px; height: 110px; background: #19486a; top:-170px; left: calc(50% - 3.5px); z-index: -1;}

.csr-section-3 { background: #f3f3f3; padding: 90px 5%; margin-bottom: 120px;}
.csr-section-3-content { display: flex;flex-direction: row; flex-wrap: wrap; justify-content: space-between }
.csr-section-3-content > div:nth-of-type(1) { width: 40%; position: relative;}
.csr-section-3-content > div:nth-of-type(1):after { content: ""; position: absolute; width: 100%; height: 65%; background: #eb9e16; clip-path: polygon(0% 0, 100% 0%, 100% 100%); top:-27px; right: -27px;}
.csr-section-3-content > div:nth-of-type(2) { width: 54%; }
.csr-section-3-content-data { color: #666666; padding-top: 20px; padding-right: 120px;}


.loop { position: relative; z-index:2;}
.loop .owl-dots { display: none;}
.loop .owl-item {position: relative; }
.loop .owl-nav { position: absolute; bottom:15px; width:110px; right: 0; z-index: 11;}
.loop .owl-prev, .loop .owl-next { position:absolute; z-index:100; top:calc(50% - 20px); background:#ff7800 !important; width: 50px; height: 50px; margin: 0 !important; border-radius: 0% !important; border: 0px solid #949494 !important; transform-origin: 50% 50%;transition: all 0.4s ease-out 0s;}
.loop .owl-prev { left:0px; }
.loop .owl-next { right:0;}
.loop .owl-prev:before, .loop .owl-next:before { font-family: 'Font Awesome 5 Free';font-weight: 900 !important;font-size:70px; color: #fff; opacity: 1;transition: all 0.4s ease-out 0s;width: 18px; height: 18px; background-size: contain; display: inline-block; border-width: 2px 2px 0 0; border-style: solid; border-color: #fff; position: relative; top:2px;}
.loop .owl-prev:before { content: ""; transform: rotate(-135deg); left: 2px; }
.loop .owl-next:before { content: ""; transform: rotate(45deg); right: 3px;}
.loop .owl-prev:hover, .loop .owl-next:hover { opacity: 0.5;}
.loop .owl-stage-outer {z-index: 2;}
.loop .owl-dots { position: absolute; z-index: 100; bottom: 25px; width: 100%; text-align: right !important; padding: 0 0px; }
.loop .owl-dots .owl-dot span, .loop  .owl-dots .owl-dot span { background: #b3b3b3 !important; width: 12px !important; height: 12px !important;}
.loop .owl-dots .owl-dot.active span, .loop  .owl-dots .owl-dot:hover span { background: #1673b5 !important; }

.csr-section-3-title { margin-bottom: 14px; color: #fff; font-weight: 700; background: #eb9e16; border-radius: 15px 0 15px 0; font-size: 20px; padding: 10px 15px;}
.welfare-list { display: flex;flex-direction: row; flex-wrap: wrap; justify-content: space-between; padding-bottom: 40px;}
.welfare-list > div:nth-of-type(1) { width: 62%;}
.welfare-list > div:nth-of-type(2) { width: 34%;}
.welfare-list > div > div { padding: 0 0 5px 36px; position: relative;}
.welfare-list > div > div:before { content: ""; position: absolute; left: 12px; top:9px; width: 11px; height: 13px; background: #eb9e16;clip-path: polygon(0% 0, 100% 50%, 0% 100%);}

.btn-104 { border-radius: 20px; border: 2px solid #eb9e16; text-align: center; padding: 12px 25px; display: flex !important; flex-direction: row; flex-wrap: nowrap; justify-content: center; align-items: center; color: #686868 !important; font-size: 32px; font-weight: 700; max-width: 360px; width: 100%; line-height: 100%;}
.btn-104 img { display: inline-block; margin-right: 15px;}

.csr-section-4 { padding: 0% 5%; display: flex;flex-direction: column; flex-wrap: wrap;}
.csr-section-4 > div { display: flex;flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center; padding-bottom: 100px; width: 100%;}
.csr-section-4 > div > div:nth-of-type(1) { width: 24%;}
.csr-section-4 > div > div:nth-of-type(2) { width: 72%;}
.csr-section-4 > div:nth-child(even) > div:nth-of-type(1) { order: 2;}
.csr-section-4 > div:nth-child(even) > div:nth-of-type(2) { order: 1;}

.loop2 { }
.loop2 .owl-dots { display: none;}
.loop2 .owl-item {position: relative; }
.loop2 .owl-nav { position: absolute; top:calc(50% - 30px); width: 100%; z-index: 11;}
.loop2 .owl-prev, .loop2 .owl-next { position:absolute; z-index:100; top:calc(50% - 20px); background:#ff7800 !important; width: 50px; height: 50px; margin: 0 !important; border-radius: 0% !important; border: 0px solid #949494 !important; transform-origin: 50% 50%;transition: all 0.4s ease-out 0s;}
.loop2 .owl-prev { left:-25px; }
.loop2 .owl-next { right:-25px;}
.loop2 .owl-prev:before, .loop2 .owl-next:before { font-family: 'Font Awesome 5 Free';font-weight: 900 !important;font-size:70px; color: #fff; opacity: 1;transition: all 0.4s ease-out 0s;width: 18px; height: 18px; background-size: contain; display: inline-block; border-width: 2px 2px 0 0; border-style: solid; border-color: #fff; position: relative; top:2px;}
.loop2 .owl-prev:before { content: ""; transform: rotate(-135deg); left: 2px; }
.loop2 .owl-next:before { content: ""; transform: rotate(45deg); right: 3px;}
.loop2 .owl-prev:hover, .loop2 .owl-next:hover { opacity: 0.5;}
.loop2 .owl-stage-outer {z-index: 2;}
.loop2 .owl-dots { position: absolute; z-index: 100; bottom: 25px; width: 100%; text-align: right !important; padding: 0 0px; }
.loop2 .owl-dots .owl-dot span, .loop2  .owl-dots .owl-dot span { background: #b3b3b3 !important; width: 12px !important; height: 12px !important;}
.loop2 .owl-dots .owl-dot.active span, .loop2  .owl-dots .owl-dot:hover span { background: #1673b5 !important; }

.align-center { text-align: center !important;}

.welfare-name { text-align: center; padding-top: 18px;}

/*contact*/
.contact-seo { border-bottom: 1px solid #f2f2f2; padding-bottom: 30px; margin-bottom: 30px;}
.contact-seo-content { max-width: 970px; margin: 0 auto;}
.contact-seo-content span { color: #eb9e16;}

.contact-box { display: flex; flex-direction: row; flex-wrap: wrap; padding-bottom: 50px; }
.contact-box > div:nth-of-type(1) { width: 65%; padding-right: 4%; border-right: 1px solid #ececec;}
.contact-box > div:nth-of-type(2) { width: 35%; padding-left: 4%; }

.contact-section { }
.contact-layout-1 { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between;}
.contact-layout-1 > div { width: calc(50% - 7px);}

.contact-form-list {  margin-bottom: 10px;display: flex; flex-direction: column; flex-wrap: nowrap; padding: 5px 0px; }
.contact-form-list > div:nth-of-type(1) { width: 100%; padding: 3px 0px;  position: relative; line-height: 170%; }
.contact-form-list > div:nth-of-type(1):after { position: absolute; content: ":"; top: 0; right: 0; display: none;}
.contact-form-list > div:nth-of-type(2) { width: calc(100% - 0px); padding-left: 0px;}
.contact-form-list2 {  margin-bottom: 10px;display: flex; flex-direction: row; flex-wrap: nowrap; padding: 5px 0px; }
.contact-form-list2 > div:nth-of-type(1) { width: 100px; padding: 3px 0px;  position: relative; line-height: 170%; }
.contact-form-list2 > div:nth-of-type(1):after { position: absolute; content: ":"; top: 0; right: 0; display: none;}
.contact-form-list2 > div:nth-of-type(2) { width: calc(100% - 100px); padding-left: 10px;}

.contact-form input[type="text"], .contact-form input[type="number"], .contact-form input[type="tel"], .contact-form input[type="phone"], .contact-form input[type="date"], .contact-form input[type="email"], .contact-form input[type="password"], .contact-form input[type="button"], .contact-form textarea { border-width:1px; border-style: solid; border-color: #cccccc; margin: 0px 0 0px 0; width: 100%; padding:0px 15px ; color:#333; background: transparent; font-family: 'Noto Sans TC', sans-serif; line-height: 40px; border-radius: 0px; }
.contact-form textarea { height:98px; padding:15px; resize:none; line-height: 140%;}
.contact-form select{ margin: 0 0 0px 0;  width:100%; max-width: 160px; background-image: url(../images/product-select.png); background-repeat: no-repeat; background-position: calc(100% - 15px) 18px; background-size: 10px; -webkit-appearance: none; -moz-appearance: none; appearance: none;   background-color: transparent;  border-width:1px; border-style: solid; border-color: #cccccc; color:#333; font-family: 'Noto Sans TC', sans-serif;  padding:0px 35px 0px 15px;  line-height: 40px; border-radius: 0px;}
.contact-form option { padding:1px 5px;}
.contact-form select::-ms-expand {
    display: none;
}

.contact-btn { display: flex; flex-direction: row; flex-wrap: wrap; }
.contact-btn > div { padding-bottom: 10px;}

.contact-note2 {  margin-top: 0px; display: inline-block;position: relative;padding-left: 22px; padding-right: 15px; padding-bottom: 0px; cursor: pointer; -webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none; line-height: 130%; color: #333; margin-bottom: 0;}
.contact-note2 input {position: absolute;opacity: 0;cursor: pointer;height: 0;width: 0;}
.checkmark {position: absolute;top: 4px;left: 0;height: 16px;width: 16px;background-color: transparent; border: 1px solid #a4a4a4; border-radius: 100%;}
.contact-note2:hover input ~ .checkmark {background-color: #eeeeee;}
.contact-note2 input:checked ~ .checkmark {border-color: #1178f2;}
.checkmark:after {content: "";position: absolute;display: none;}
.contact-note2 input:checked ~ .checkmark:after {display: block;}
.contact-note2 .checkmark:after {left: 2px;top: 2px;width: 10px;height: 10px; background: #1178f2; border-radius: 100%;}

.contact-info { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; padding-bottom: 30px; padding-top: 20px;}
.contact-info > div { margin-bottom: 12px;  }
.contact-info > div:nth-child(odd) { width: 45px; height: 45px; border-radius: 100%; background: #eb9e16; text-align: center; line-height: 40px;}
.contact-info > div:nth-child(odd) img { width: 17px; }
.contact-info > div:nth-child(even) { width: calc(100% - 45px); padding-left: 22px;}
.contact-info > div:nth-child(even) a { word-break: break-all; }
.contact-info > div:nth-child(even) a:hover {  }

.contact-map iframe { height: 300px; width: 100%; border-width: 0;}
.color-red { color: #d02f2f;}

.btn01 { display: block; width: 150px; height: 40px; border-radius: 20px; border: 1px solid #333333; text-align: center; padding-top: 0px ; background: none;  transition: all 0.4s ease-out 0s; font-size: 16px; color: #333; }
.btn01:hover { color:#fff; background: #333;  }

.news-video-pto{position: relative;overflow: hidden;width: 100%;height: 0;padding-bottom: 56.25%;}
.news-video-pto iframe{position: absolute;top: 0;left: 0;line-height: 0;width: 100%;height: 100%;}

/*service*/
.service-section-1 { padding: calc(20px + 4%) 5% calc(48px + 2.5%) 5%; background: #eb9e16; color: #fff;}
.service-section-1-title { color: #fff; font-weight: 300; line-height:1.4; text-align: center; padding-bottom: 35px; font-size: clamp(22px, 2.5vw, 36px);}
.service-section-1-icon { display:flex; flex-direction: row; flex-wrap: wrap; justify-content: center; padding: 0 5%;}
.service-section-1-icon > div { padding: 0 20px 15px 20px;}

.service-section-2 { position: relative; z-index: 3; margin-top: -48px; margin-bottom: calc(20px + 4%); display: flex; flex-direction: row; flex-wrap: wrap;}
.service-section-2 > div { width: 33.33%;border-width: 0 0 1px 1px; border-style: solid; border-color:#dedede; }
.service-section-2 > div:last-child { border-right: 1px solid #dedede;}
.service-section-2 > div:nth-of-type(1) .service-section-2-title { background: #37903e;}
.service-section-2 > div:nth-of-type(2) .service-section-2-title { background: #19486a;}
.service-section-2 > div:nth-of-type(3) .service-section-2-title { background: #ffa300;}
.service-section-2-title { height: 257px; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; align-items: center;}
.service-section-2-title > div:nth-of-type(1) { padding: 0 10px;font-size: 130px; font-weight: 700; position: relative; top:-8px;
	-webkit-text-fill-color: transparent;
	-webkit-text-stroke: 2px #ffffff;}
.service-section-2-data { text-align: center; padding:15px 5% 20px 5%; line-height: 1.8;}

.service-title { margin-bottom: 30px;}
.service-title span { padding-left: 52px;}
.service-title:after { left: 0px;}

.service-section-3 { display: flex;flex-direction: column;flex-wrap: nowrap; padding-bottom: calc(20px + 4%); padding-left: 52px}
.service-section-3 > div { padding-bottom: 20px;}
.service-section-3-title { font-size: 24px; font-weight: 700; position:relative; padding-bottom: 12px;}
.service-section-3-title:before { content: ""; position:absolute; width: 40px; height: 2px; left: -52px; top:15px; background: #333333;}

.service-section-4 { background: #f3f3f3; padding: calc(20px + 4%) 5%;}
.service-section-5 { background: #fff; padding: calc(20px + 4%) 5%;}

@media only screen and (max-width: 1680px) {
	
}
@media only screen and (max-width: 1366px) {
	
}
@media only screen and (max-width: 1279px) {
    #content { font-size: 16px; line-height:26px; }
    #content p{ font-size: 16px;line-height:26px;}
    p, td, li, label { font-size: 16px;line-height:26px; }
	
	.title01 > h1, .title01 > div { font-size: 22px;}
	.title01:before { width: 15px; height: 9px; top:-3px; left: -14px;}
	
	.news-title { font-size: 28px;}
	
	.news-detail-section > div:nth-of-type(1) { width: calc(100% - 0px); padding-right: 0px; padding-bottom: 30px; }
	.news-detail-section > div:nth-of-type(2) { width: 100%; }
	
	.blog-aside-title span { font-size: 22px; }
	.blog-aside-title:after { transform-origin: 100% 100%; transform: scale(0.5);}
	
	.class-title { font-size: 20px; margin-bottom: 15px;}
	.class-list > div > div:nth-of-type(1) { padding-right: 5%;}
	
	.about-title-1 { font-size: 26px; padding-bottom: 15px;}
	.about-title-1 span { font-size: 26px;}

	.about-section-4-content > a { width: 260px; margin: 0 10px 20px 10px; border-radius: 30px; padding-left: 60px; }
	.about-section-4-content > a > span { font-size: 18px; min-height: 60px;}
	.about-section-4-content > a > img { top:-10px; width: 60px;}
	
	.csr-section-3 { margin-bottom: 50px;}
	.csr-section-3-content > div:nth-of-type(1) { width: 100%; padding-bottom: 30px; }
	.csr-section-3-content > div:nth-of-type(2) { width: 100%; }
		
	.csr-section-4 > div { padding-bottom: 60px;}
	.csr-section-4 > div > div:nth-of-type(1) { width: 100%;}
	.csr-section-4 > div > div:nth-of-type(2) { width: 100%;}
	.csr-section-4 > div:nth-child(even) > div:nth-of-type(1) { order: 1;}
	.csr-section-4 > div:nth-child(even) > div:nth-of-type(2) { order: 2;}
	
	.contact-box > div:nth-of-type(1) { width: 100%; padding-right:0%; border-bottom: 1px solid #ececec;border-right: 0px solid #ececec; padding-bottom: 25px;}
	.contact-box > div:nth-of-type(2) { width: 100%; padding-left: 0%; }

	/*service*/
	.service-section-2-title { height: 160px;}
	.service-section-2-title > div:nth-of-type(1) { font-size: 60px; top:-4px;}
	.service-section-2-title > div img { width: 50px;}

	.service-title:after { transform-origin: 0% 50%;}
	.service-title span { padding-left: 30px; display: inline-block;}

	.service-section-3 { padding-left: 30px;}
	.service-section-3-title { font-size: 20px;}
	.service-section-3-title:before { width: 18px; left: -30px; top:13px; }
}

@media only screen and (max-width: 980px) {
	.banner-pc { display: none}
	.banner-mobile { display: block;}
	
	aside { padding-bottom: 15px;}
	aside > a { font-size: 16px; }
	aside > a:hover, aside > a.current { font-size: 20px;}
	
	.main-bg {padding-top: 25px; }
	
	.news-focus-section { padding-bottom: 30px;}
	.news-focus-section > div { width: 100%;}
	.news-focus-section > div:nth-of-type(1) { padding-right: 0%; order: 2;}
	.news-focus-section > div:nth-of-type(2) { padding-left: 0px; order: 1; margin-bottom: 22px;}
	.news-date { margin-bottom: 15px;}
	.news-title { font-size: 18px; font-weight: 400;}
	
	.news-list-section { margin-right: -20px; padding-bottom: 30px;}
	.news-list-section > div { padding-bottom: 30px; margin-right: 20px; width: calc(50% - 20px);}
	
	.class-list > div > div { width: 100%;}
	.class-list > div > div:nth-of-type(1) { order: 2;}
	.class-list > div > div:nth-of-type(2) { order: 1;}
	.class-list > div > div:nth-of-type(1) { padding: 20px 25px 30px 25px;}
	.class-title { padding-bottom: 15px;}
	.class-title:before { top: auto; bottom: 0; left: 0; height: 6px; width: 100px;}
	
	.about-section-1-box > div { width: 100%;}
	.about-section-1-box > div:nth-of-type(1) { order: 2; padding-right: 5%;}
	.about-section-1-box > div:nth-of-type(2) { order: 1; margin-bottom: 20px;}
	.about-section-1-content { max-width: 100%;}
	.about-section-1:after { opacity: 0.1;}
	
	.about-section-2-content > div { padding-left: 35px; padding-right: 20px; padding-top: 40px;}
	.about-section-2-title { font-size: 22px;}
	.about-section-2-title:before { left: -35px; top:15px; width: 20px;}
	.about-section-2-title-2 {  padding:7px 14px; font-size: 18px; }
	
	/*.about-section-3 { 
		background-image: linear-gradient(90deg, rgba(255,255,255,.7) 0%, rgba(255,255,255,.7) 100%), url("../images/about-section-3-bg.png");
		background-position: center center, center right;
		background-repeat: no-repeat, no-repeat;
		background-size:auto, 70%;}*/
	
	.about-section-3-box > div { width: 100%;}
	.about-section-3-content { }

	
	
	.csr-section-1 > div { width: 100%;}
	.csr-section-1 > div:nth-of-type(1) { padding-right:0px; text-align: center; padding-bottom: 25px;}
    .csr-section-1 .csr-button{text-align: center;padding: 5% 0 ;}
    .csr-section-1 .csr-button a{border: #FFF 2px solid;}
    .csr-section-1 .csr-button a:hover {border: #FFF 2px solid;}
	
	.csr-section-2 { margin-top: 0; padding-top: 40px;}
	.csr-section-2:before { height: 20%;  }
	.csr-section-2-title { font-size: 7vw; padding-bottom: 0;}
	.csr-section-2-list { flex-direction: column;}
	.csr-section-2-list > div { max-width:inherit; width: 100%; display:flex; flex-direction: row; flex-wrap: wrap; align-items: flex-start; margin-bottom: 25px;}
	.csr-section-2-list > div > img { width: 45%;}
	.csr-section-2-list > div > div { width: 55%; padding-left: 25px; padding-top: 15%;}
	.csr-section-2-data { margin-top: 0;}
	.csr-section-2-data:before, .csr-section-2-data:after { display: none;}
	.csr-section-2-data > b { font-size: 20px; }
	
	.csr-section-3 { padding: 60px 5% 40px 5%;}
	.csr-section-3-title { font-size: 18px;}

	/*service*/
	.service-section-1-icon { padding: 0 0%;}
}
@media only screen and (max-width: 768px) {
	#path { padding: 0 0 10px 0; }
	
	.news-title, .news-title-s { font-size: 16px !important;}
	.news-date { font-size: 14px;}
	.news-date:before { top:6px;}
	
	.blog-aside-title { margin-bottom: 10px; }
	
	.class-title { font-size: 18px; }
	
	.about-section-2-content > div { width: 100%;}

	.welfare-list > div:nth-of-type(1) { width: 100%;}
	.welfare-list > div:nth-of-type(2) { width: 100%;}
	.btn-104 { padding: 12px 20px; font-size: 22px; max-width: 240px; }
	.btn-104 img { width: 70px;}
	
	.contact-layout-1 > div { width: calc(100% - 0px);}
}
@media only screen and (max-width: 640px) {
	/*service*/
	.service-section-2 > div { width: 100%;border-right: 1px solid #dedede;}
	.service-section-2-title { height: 120px;}
}
@media only screen and (max-width: 570px) {
	.news-list-section > div { width: calc(100% - 20px);}
	
	.blog-aside-title:after { top:-35px; left: -45px; z-index: -1;transform: scale(0.4);}
	
	.about-title-1, .about-title-1 span { font-size: 22px; }
	
	.csr-section-2-list > div { flex-direction: column;}
	.csr-section-2-list > div > img { width: 100%; max-width: 280px; margin: 0 auto 20px auto;}
	.csr-section-2-list > div > div { width: 100%; padding-left: 0px; padding-top: 0;}
	
	.loop2 .owl-prev { left:0px; }
	.loop2 .owl-next { right:0px;}

	/*service*/
	.service-title:after { left: 0; top: -20px;}

	.service-section-1-icon > div { padding: 0 10px 15px 10px;;}
	.service-section-1-icon > div img { max-width: 55px;}
}

@media only screen and (max-width: 414px) {
    
}

@media only screen and (max-width: 320px) {
	.about-section-4-content > a > span { font-size: 16px; justify-content: flex-start; padding-left: 10px;}
	
}