@charset "utf-8";
/*
  danny 201902
  1. $Mobile
  2. $Pad
  3. $橫的版型
  4. $Pc
  5. $1025~1279
*/






/* $Mobile
--------------------------------------------------------------------------------------*/

h3{ font-size: 2.0rem; font-weight: bold; color: #000; text-align: center; margin: 0 0 0 0; }
.recruitment-container{}
/* news header */
.recruitment_header-box{ width: 100%; min-height: 100px; background: url(../images/recruit_header_bg--mobile.jpg); background-size: cover; box-sizing: border-box; padding: 20px 0 10px 0; position: relative; }
.recruitment_menu-box{ width: 95vw; margin: 10px auto; display: flex; flex-wrap: wrap; justify-content: center;  font-size: 1.2rem; line-height: 2.5em; color: #000; }
.recruitment_menu-box>li{ border-radius: 20px; border: 1px solid #000; margin: 0 0 10px 0; transition: all .3s cubic-bezier(.23,1,.32,1); }
.recruitment_menu-box>li:hover,.recruitment_menu-box>li.active{ background: #fff; border-color: #fff; color: #d75975; }
.recruitment_menu-box>li>a{ width: 100%; line-height: 2.5em; box-sizing: border-box; padding: 0 10px;  }
.recruitment_menu-box>li+li{ margin: 0 0 10px 5px; }
/* list */
.recruitment_list-box{ width: 300px; margin: 20px auto 0; }
.recruitment_list-box>li{ width: 100%; font-size: 1.6rem; line-height: 1.5em; color: #000; margin-bottom: 40px; }
.recruitment_list-box>li>a{ width: 100%; height: 100%; position: absolute; left:0; top: 0; }
.img-box>img{ width: 100%; }

/* 20250702 */
.recruitment-box{ width: 90vw; margin: 20px auto 0; font-size: 1.6rem; line-height: 1.58; color: #000; }
.recruitment-box .img-box{ height: auto; }
.recruitment-box .tit{ font-size: 2.4rem; font-weight: bold; color: #000; text-align: center; }
.recruitment-box .subtit{ font-size: 1.8rem; font-weight: bold; color: #F0850C; text-align: center; margin: 0 0 10px 0; }
.recruitment-box .txt_hlight01{ font-size: 1.8rem; font-weight: bold; color: #F0850C; margin: 0 0 3px 0; }
.recruitment-box .txt_hlight02{ font-size: 1.8rem; font-weight: bold; color: #52AEEA; margin: 0 0 3px 0;}
.recruitment-box .txt_hlight03{ color: #F0850C;  }
.recruitment-box .about-slider{ margin: 0 0 40px 0; }
.recruitment-box .about-slider img{ width: 100%; }
.recruitment-box .col-box{ display: flex; flex-direction: column; gap: 20px; margin: 20px 0 30px 0; }
.recruitment-box .col-box .img-box{ width: 100%; height: auto; }
.recruitment-box .col-box .img-box.w520{ width: 100%; }
.recruitment-box .col-box .img-box img{  display: block; width: 100%; }
.recruitment-box .slider-dot{ display: flex; justify-content: center; align-items: center; margin: 10px 0 10px 0; }
.recruitment-box .slider-dot .slick-dots{ display: flex; justify-content: center;  }
.recruitment-box .slider-dot li{ width: 14px; height: 14px; border-radius: 100%; background: #C6C6C6; text-indent: -9999px; margin: 0 5px;  }
.recruitment-box .slider-dot li.slick-active{ background: #F0850C; }
/* slick-arrow */
.recruitment-box .slick-arrow{ width: 30px; height: 30px; border-radius: 50%; background: rgba(255,255,255,0.7); position: absolute; top: 40%; cursor: pointer; z-index: 2; text-indent: -9999px; transition: all 0.4s cubic-bezier(.23,1,.32,1); }
.recruitment-box .slick-next{ right: 10px; }
.recruitment-box .slick-next:before{ content: '\e876'; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); text-indent:0; transition: all 0.3s cubic-bezier(.23,1,.32,1); }
.recruitment-box .slick-next:hover:before{ left: 60%; }
.recruitment-box .slick-prev{ left: 10px }
.recruitment-box .slick-prev:before{ content: '\e875'; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); text-indent:0;  transition: all 0.3s cubic-bezier(.23,1,.32,1); }
.recruitment-box .slick-prev:hover:before{ left: 40%; }
.recruitment-box .intro{ text-align: center }
.recruitment-box .joinus-colorbar{ width: 100%; height: 40px; border-radius: 10px; background: #FFEFC1; display: flex; justify-content: center; align-items: center; font-size: 2.4rem; color: #000; margin: 0 0 20px 0;}
.recruitment-box .img-box.joinus{ width: 90%; height: auto; margin: 0 auto;  }
.recruitment-box .img-box.joinus img{ width: 100%; }
.recruitment-box .joinus-list{ display: flex; justify-content: center; flex-wrap: wrap; gap:20px }
.recruitment-box .joinus-list>li{ width: 100%; border-radius: 10px; background: #fff7dd; border: 1px solid #FF9933; box-sizing: border-box; padding: 30px 0 0 0; font-size: 1.6rem;  line-height: 1.58; color: #000;  }
.recruitment-box .joinus-list>li .top{ width: 100%; height: 70px; background: #f93; position: relative; font-size: 2.4rem; font-weight: bold; color: #fff; display: flex; align-items: end; box-sizing: border-box; padding: 0 0 0 35px; }
.recruitment-box .joinus-list>li .top p{ margin: 0 0 15px 5px; }
.recruitment-box .dot-list{ list-style: disc; box-sizing: border-box; padding: 15px; margin: 0 0 0 25px; }
/* faq */
.recruitment-box .faq-list{ width: 90vw; margin: 0 auto; }
.recruitment-box .faq-list>li{ width: 100%; min-height: 60px; border-radius: 10px; border: 3px solid #000; background: #fffdf8; position: relative; margin: 0 0 40px 0; }
.recruitment-box .faq-list>li:before{ content: ''; width: calc( 100% - 15px); height: 100%; border-radius: 10px; border: 3px solid #000; background: #F5DFC4; box-sizing: content-box; position: absolute; left: -15px; top: -3px; z-index: -1; }
.recruitment-box .faq-q{ font-size: 1.6rem; font-weight: bold; color: #F0850C; position: relative; box-sizing: border-box; padding: 15px 38px 10px 50px; cursor: pointer;  }
.recruitment-box .q-tit{ font-size: 2rem;  }
.recruitment-box .faq-q .arrow{ position: absolute; right: 20px; top: 16px; }
.recruitment-box .faq-q .arrow:before{ content: '\e916'; font-size: 2rem;  }
.recruitment-box .faq-list>li.active .faq-q .arrow:before{ content: '\e917'; }
.recruitment-box .faq-a{ box-sizing: border-box; padding: 10px 30px 30px 30px; display: none; font-size: 1.4rem;  }
.recruitment-box .faq-a:before{ content: ''; display: block; width: 100%; border-top: 4px dotted #FFD2B5; margin: 0 0 15px 0;  }
.recruitment-box .q-txt{ display: flex; box-sizing: border-box; padding: 0 0 0 20px;   }
.recruitment-box .q-txt .col-2{ margin:  6px 0 0 5px; }
.recruitment-box .a-tit{ font-size: 2rem; line-height: 1;  }
.recruitment-box .faq-list .icon{ position: absolute; left: 10px; top: -20px;  }
.recruitment-box .faq-list .dot-list{ margin: 0 0 0 0; }
.recruitment-box .qrcode{ display: flex; justify-content: center; margin: 0 0 30px 0; position: relative; }
.recruitment-box .qrcode .pc{ display: none; }
.recruitment-box .qrcode .mobile{ display: block; max-width: 90vw; }
.recruitment-box .qrcode a{ display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; }
/* experience */
.recruitment-box .experience-list{ width: 90vw; margin: 0 auto; }
.recruitment-box .experience-list>li{ display: flex; margin: 0 0 40px 0;}
.recruitment-box .experience-list>li .col-1{ margin: 0 0 0 0; }
.recruitment-box .experience-list .name{ font-size: 1.4rem; font-weight: bold; box-sizing: border-box; padding: 0 0 5px 10px; }
.recruitment-box .experience-list .img-box{ width: 80px; }
.recruitment-box .experience-list .img-box img{ width: 100%; }
.recruitment-box .expandable-txt{ display: none;  }
.recruitment-box .expandable-txt:before{ content: ''; display: block; width: 100%;  border-bottom: 2px dotted ; margin: 10px 0 20px 0; }
.recruitment-box .expandable-box{ min-width: 280px; width: 100%; font-size: 1.4rem; line-height: 1.58; border-radius: 20px; background: #ffefc1; box-sizing: border-box; padding: 10px 10px 10px 10px;  }
.recruitment-box .expandable-tit{ font-size: 1.5rem; font-weight: bold; position: relative;  cursor: pointer; box-sizing:border-box; padding: 0 30px 0 0;}
.recruitment-box .expandable-tit:after{  content: '\e907'; position: absolute; right: 0px; top: 10px; font-size: 2rem; line-height: 0; }
.recruitment-box .expandable-tit.active:after{  content: '\e908'; }
.recruitment-box .expandable-subtit{ font-weight: bold; }
.recruitment-box .experience-list>li:nth-child(odd) .expandable-tit{ color: #F0850C; }
.recruitment-box .experience-list>li:nth-child(odd) .expandable-txt:before{ border-color: #F0850C; }
.recruitment-box .experience-list>li:nth-child(odd) .expandable-subtit{ color: #F0850C; }
.recruitment-box .experience-list>li:nth-child(odd) .expandable-box{ background: #ffefc1; }
.recruitment-box .experience-list>li:nth-child(even) .expandable-tit{ color: #3DB054; }
.recruitment-box .experience-list>li:nth-child(even) .expandable-txt:before{ border-color: #3DB054; }
.recruitment-box .experience-list>li:nth-child(even) .expandable-subtit{ color: #3DB054; }
.recruitment-box .experience-list>li:nth-child(even) .expandable-box{ background: #E6F0CD; }
/* apply */
.apply-box{ position: fixed; right: 15px; bottom: 115px; z-index: 999; }
.apply-box{ width: 40px; height: 40px; border-radius: 50%; background: #F0850C; box-shadow:0px 0px 6px 3px rgba(0, 0, 0, 0.16) ; cursor: pointer; display: flex; flex-direction: column; justify-content: center; align-items: center; color: #fff; font-size: 1.1rem; }
.apply-box a{ text-indent: -9999px; width: 100%; height: 100%; position: absolute; left: 0; top: 0; }






/* $Pad
--------------------------------------------------------------------------------------*/
@media screen and (min-width:600px) and (max-width:1024px){

h3{ font-size: 2.0rem; font-weight: bold; color: #000; text-align: center; margin: 0 0 0 0; }
.recruitment-container{}
.recruitment_header-box{ width: 100%; min-height: 100px; background: url(../images/recruitment_header_bg--mobile.jpg); background-size: cover; box-sizing: border-box; padding: 20px 0 10px 0; position: relative; }
.recruitment_menu-box{ width: 95vw; margin: 10px auto; display: flex; flex-wrap: wrap; justify-content: center;  font-size: 1.2rem; line-height: 2.5em; color: #000; }
.recruitment_menu-box>li{ border-radius: 20px; border: 1px solid #000; margin: 0 0 10px 0; transition: all .3s cubic-bezier(.23,1,.32,1); }
.recruitment_menu-box>li:hover,.recruitment_menu-box>li.active{ background: #fff; border-color: #fff; color: #d75975; }
.recruitment_menu-box>li>a{ width: 100%; line-height: 2.5em; box-sizing: border-box; padding: 0 10px;  }
.recruitment_menu-box>li+li{ margin: 0 0 10px 5px; }
/* list */
.recruitment_list-box{ width: 85%;  margin: 40px auto 0; }
.recruitment_list-box>li{ width: 300px; height: 340px; font-size: 1.6rem; line-height: 1.5em; color: #000; margin-bottom: 20px; }
.img-box{ width: 100%; }
.img-box>img{ width: 100%; transition:all .4s cubic-bezier(.23,1,.32,1); }
.recruitment_list-box>li:hover .img-box>img{ transform: scale(1.2); opacity: .7; }

}





/* $橫的版型 */
@media screen and (orientation:landscape){ 

h3{ font-size: 2.0rem; font-weight: bold; color: #000; text-align: center; margin: 0 0 0 0; }
.recruitment-container{}
.recruitment_header-box{ width: 100%; min-height: 100px; background: url(../images/recruitment_header_bg--mobile.jpg); background-size: cover; box-sizing: border-box; padding: 20px 0 10px 0; position: relative; }
.recruitment_menu-box{ width: 95vw; margin: 10px auto; display: flex; flex-wrap: wrap; justify-content: center;  font-size: 1.2rem; line-height: 2.5em; color: #000; }
.recruitment_menu-box>li{ border-radius: 20px; border: 1px solid #000; margin: 0 0 10px 0; transition: all .3s cubic-bezier(.23,1,.32,1); }
.recruitment_menu-box>li:hover,.recruitment_menu-box>li.active{ background: #fff; border-color: #fff; color: #d75975; }
.recruitment_menu-box>li>a{ width: 100%; line-height: 2.5em; box-sizing: border-box; padding: 0 10px;  }
.recruitment_menu-box>li+li{ margin: 0 0 10px 5px; }
/* list */
.recruitment_list-box{ width: 88%;  margin: 40px auto 0; }
.recruitment_list-box>li{ width: 300px; height: 340px; font-size: 1.6rem; line-height: 1.5em; color: #000; margin-bottom: 20px; }
.img-box{ width: 100%; }
.img-box>img{ width: 100%; transition:all .4s cubic-bezier(.23,1,.32,1); }
.recruitment_list-box>li:hover .img-box>img{ transform: scale(1.2); opacity: .7; }

}





/* $Pc
--------------------------------------------------------------------------------------*/
@media screen and (min-width: 1025px){

h3{ font-size: 3.0rem; font-weight: bold; color: #000; text-align: center; margin: 0 0 0 0; }
.recruitment-container{}
.recruitment_header-box{ width: 100%; height: 140px; background: url(../images/recruit_header_bg.jpg); background-size: cover; box-sizing: border-box; padding: 30px 0 0 0; position: relative; }
.recruitment_menu-box{ display: flex; justify-content: center; font-size: 1.8rem; line-height: 35px; color: #000; margin: 10px 0 0 0; }
.recruitment_menu-box>li{ border-radius: 20px; border: 1px solid #000; margin: 0 0 0 0; transition: all .3s cubic-bezier(.23,1,.32,1); }
.recruitment_menu-box>li:hover,.recruitment_menu-box>li.active{ background: #fff; border-color: #fff; color: #d75975;  }
.recruitment_menu-box>li>a{ width: 100%; line-height: 35px; box-sizing: border-box; padding: 0 15px;  }
.recruitment_menu-box>li+li{ margin: 0 0 0 10px; }
/* list */
.recruitment_list-box{ width: 100%; max-width: 1100px; margin: 40px auto 0; }
.recruitment_list-box>li{ width: 240px; height: 330px; font-size: 1.6rem; line-height: 1.5em; color: #000; margin-bottom: 20px; }
.hottopic .recruitment_list-box>li{ width: 340px; height: 290px; font-size: 1.6rem; line-height: 1.5em; color: #000; margin-bottom: 20px; }
.hottopic .img-box{ width: 340px; height: 191px; overflow: hidden; }
.img-box>img{ width: 100%; transition:all .4s cubic-bezier(.23,1,.32,1); }
.recruitment_list-box>li:hover .img-box>img{ transform: scale(1.2); opacity: .7; }

/* 20250702 */
.recruitment-box{ width: 100%; max-width: 1100px; margin: 40px auto 0; font-size: 1.8rem; line-height: 1.58; color: #000; }
.recruitment-box .img-box{ height: auto; }
.recruitment-box .tit{ font-size: 3.6rem; font-weight: bold; color: #000; text-align: center; }
.recruitment-box .subtit{ font-size: 2rem; font-weight: bold; color: #F0850C; text-align: center; margin: 0 0 10px 0; }
.recruitment-box .txt_hlight01{ font-size: 2rem; font-weight: bold; color: #F0850C; margin: 0 0 3px 0; }
.recruitment-box .txt_hlight02{ font-size: 2rem; font-weight: bold; color: #52AEEA; margin: 0 0 3px 0;}
.recruitment-box .about-slider{ margin: 0 0 40px 0; }
.recruitment-box .col-box{ display: flex; flex-direction: row; justify-content: space-between; gap: 40px; margin: 20px 0 60px 0; }
.recruitment-box .col-box .img-box{ width: 620px; height: auto; }
.recruitment-box .col-box .img-box.w520{ width: 520px; }
.recruitment-box .col-box .img-box img{ display: block; width: auto; }
.recruitment-box .slider-dot{ display: flex; justify-content: center; align-items: center; margin: 10px 0 10px 0; }
.recruitment-box .slider-dot .slick-dots{ display: flex; justify-content: center;  }
.recruitment-box .slider-dot li{ width: 14px; height: 14px; border-radius: 100%; background: #C6C6C6; text-indent: -9999px; margin: 0 5px;  }
.recruitment-box .slider-dot li.slick-active{ background: #F0850C; }
/* slick-arrow */
.recruitment-box .slick-arrow{ width: 50px; height: 50px; border-radius: 50%; background: rgba(255,255,255,0.7); position: absolute; top: 45%; cursor: pointer; z-index: 2; text-indent: -9999px; transition: all 0.4s cubic-bezier(.23,1,.32,1); }
.recruitment-box .slick-next{ right: 10px; }
.recruitment-box .slick-next:before{ content: '\e876'; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); text-indent:0; transition: all 0.3s cubic-bezier(.23,1,.32,1); }
.recruitment-box .slick-next:hover:before{ left: 60%; }
.recruitment-box .slick-prev{ left: 10px }
.recruitment-box .slick-prev:before{ content: '\e875'; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); text-indent:0;  transition: all 0.3s cubic-bezier(.23,1,.32,1); }
.recruitment-box .slick-prev:hover:before{ left: 40%; }
.recruitment-box .intro{ text-align: center }
.recruitment-box .joinus-colorbar{ width: 100%; height: 40px; border-radius: 10px; background: #FFEFC1; display: flex; justify-content: center; align-items: center; font-size: 2.4rem; color: #000; margin: 0 0 20px 0;}
.recruitment-box .img-box.joinus{ width: 90%; height: auto; margin: 0 auto;  }
.recruitment-box .img-box.joinus img{ width: 100%; }
.recruitment-box .joinus-list{ display: flex; justify-content: center; flex-wrap: wrap; gap:40px }
.recruitment-box .joinus-list>li{ width: 340px; border-radius: 10px; background: #fff7dd; border: 1px solid #FF9933; box-sizing: border-box; padding: 30px 0 0 0; font-size: 1.8rem;  line-height: 1.58; color: #000;  }
.recruitment-box .joinus-list>li .top{ width: 100%; height: 70px; background: #f93; position: relative; font-size: 2.4rem; font-weight: bold; color: #fff; display: flex; align-items: end; box-sizing: border-box; padding: 0 0 0 35px; }
.recruitment-box .joinus-list>li .top p{ margin: 0 0 15px 5px; }
.recruitment-box .dot-list{ list-style: disc; box-sizing: border-box; padding: 15px; margin: 0 0 0 25px; }
/* faq */
.recruitment-box .faq-list{ width: auto; margin: 0; }
.recruitment-box .faq-list>li{ width: 1085px; min-height: 85px; border-radius: 10px; border: 3px solid #000; background: #fffdf8; position: relative; margin: 0 0 40px 0; }
.recruitment-box .faq-list>li:before{ content: ''; width: calc(100% + 12px); height: 100%; border-radius: 10px; border: 3px solid #000; background: #F5DFC4; box-sizing: content-box; position: absolute; left: -15px; top: -3px; z-index: -1; }
.recruitment-box .faq-q{ font-size: 2rem; font-weight: bold; color: #F0850C; position: relative; box-sizing: border-box; padding: 15px 10px 10px 70px; cursor: pointer;  }
.recruitment-box .q-tit{ font-size: 3rem;  }
.recruitment-box .faq-q .arrow{ position: absolute; right: 30px; top: 20px; }
.recruitment-box .faq-q .arrow:before{ content: '\e916'; font-size: 2.8rem;  }
.recruitment-box .faq-list>li.active .faq-q .arrow:before{ content: '\e917'; }
.recruitment-box .faq-a{ box-sizing: border-box; padding: 10px 30px 30px 30px; display: none; font-size: 1.8rem;  }
.recruitment-box .faq-a:before{ content: ''; display: block; width: 100%; border-top: 4px dotted #FFD2B5; margin: 0 0 15px 0;  }
.recruitment-box .q-txt{ display: flex; box-sizing: border-box; padding: 0 0 0 50px;  }
.recruitment-box .q-txt .col-2{ margin:  6px 0 0 5px; }
.recruitment-box .a-tit{ font-size: 3rem; line-height: 1;  }
.recruitment-box .faq-list .icon{ position: absolute; left: 30px; top: -20px;  }
.recruitment-box .faq-list .dot-list{ margin: 0 0 0 0; }
.recruitment-box .qrcode{ margin: 0 0 30px 0; position: relative; }
.recruitment-box .qrcode .pc{ display: block; }
.recruitment-box .qrcode .mobile{ display: none; }
.recruitment-box .qrcode a{ display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; }
/* experience */
.recruitment-box .experience-list{ width: auto; margin: 0; }
.recruitment-box .experience-list>li{ display: flex; margin: 0 0 60px 0;}
.recruitment-box .experience-list>li .col-1{ margin: 0 10px 0 0; }
.recruitment-box .experience-list>li .img-box{ width: auto; }
.recruitment-box .experience-list .name{ font-weight: bold; box-sizing: border-box; padding: 0 0 10px 35px; font-size: 1.8rem; }
.recruitment-box .expandable-txt{ display: none;  }
.recruitment-box .expandable-txt:before{ content: ''; display: block; width: 100%;  border-bottom: 2px dotted ; margin: 10px 0 20px 0; }
.recruitment-box .expandable-box{ width: 800px; font-size: 1.8rem; line-height: 1.58; border-radius: 50px; background: #ffefc1; box-sizing: border-box; padding: 20px 30px 20px 30px;  }
.recruitment-box .expandable-tit{ font-size: 2.6rem; font-weight: bold; position: relative;  cursor: pointer;}
.recruitment-box .expandable-tit:after{  content: '\e907'; position: absolute; right: 0px; top: 20px; font-size: 4rem; line-height: 0; }
.recruitment-box .expandable-tit.active:after{  content: '\e908'; position: absolute; right: 0px; top: 20px; font-size: 4rem; line-height: 0; }
.recruitment-box .expandable-subtit{ font-weight: bold; }
.recruitment-box .experience-list>li:nth-child(odd) .expandable-tit{ color: #F0850C; }
.recruitment-box .experience-list>li:nth-child(odd) .expandable-txt:before{ border-color: #F0850C; }
.recruitment-box .experience-list>li:nth-child(odd) .expandable-subtit{ color: #F0850C; }
.recruitment-box .experience-list>li:nth-child(odd) .expandable-box{ background: #ffefc1; }
.recruitment-box .experience-list>li:nth-child(even) .expandable-tit{ color: #3DB054; }
.recruitment-box .experience-list>li:nth-child(even) .expandable-txt:before{ border-color: #3DB054; }
.recruitment-box .experience-list>li:nth-child(even) .expandable-subtit{ color: #3DB054; }
.recruitment-box .experience-list>li:nth-child(even) .expandable-box{ background: #E6F0CD; }
/* apply */
.apply-box{ position: fixed; right: 25px; bottom: 170px; }
.apply-box{ width: 60px; height: 60px; border-radius: 50%; background: #F0850C; box-shadow:0px 0px 6px 3px rgba(0, 0, 0, 0.16) ; cursor: pointer; display: flex; flex-direction: column; justify-content: center; align-items: center; color: #fff; font-size: 1.4rem; }
.apply-box>li>a{ text-indent: -9999px; width: 100%; height: 100%; position: absolute; left: 0; top: 0; }

}




/* $kv
--------------------------------------------------------------------------------------*/
@media screen and (min-width:1098px) and (max-width:1250px){



}





/* $1025~1279
--------------------------------------------------------------------------------------*/
@media screen and (min-width:1025px) and (max-width:1279px){


}