/*
Theme Name:fine-recruit
*/
@charset "utf-8";

html {
  scroll-behavior: smooth;
  scroll-padding-top: 115px;
}
@media only screen and (max-width: 767px) {
  html {
    scroll-padding-top: 64px;
  }
}
body{font-size: 16px; font-family: 'Noto Sans JP', sans-serif; position: relative; line-height: 1.7; color: #333333; font-weight: 400;}
a{text-decoration: none !important; font-weight: normal;}
span{display: block;}
img{max-width: 100%;}
.pad_block{display: none;}
ul{padding-left: 0;}
.img_a{display: block; transition: .3s;}
.img_a:hover{opacity: .7;}

/*--- header ---*/
#header{position: fixed; top: 0; left: 0; width: 100%; color: #fff; z-index: 10; transition: .3s;}
#header a{display: block; color: #fff;}
#header.fixed{background-color: #fff;}
#header.fixed a{color: #1F286F;}
#header .head_inner{padding: 20px 20px; position: relative;}
#header .head_logo > a{display: flex; align-items: center; transition: .3s;}
#header .head_logo > a:hover{opacity: .6;}
#header.fixed .head_logo > a{color: #231815;}
#header .head_logo .after{display: none;}
#header.fixed .head_logo .before{display: none;}
#header.fixed .head_logo .after{display: block;}
#header .head_logo img{max-width: 200px; padding-right: 20px;}
#header .head_logo > a span{font-size: 12px; padding-left: 20px; border-left: 1px solid #fff;}
#header .head_logo > a span h1{font-size: 12px; display: inline; margin-bottom: 0; font-weight: normal;}
#header.fixed .head_logo > a span{border-left: 1px solid #231815;}
#header .head_nav{font-size: 14px; height: 75.6px;}
#header .head_nav .up_nav{margin-bottom: 10px;}
#header .head_nav .up_nav ul{display: flex; align-items: center; justify-content: flex-end;}
#header .head_nav .up_nav ul li{margin: 0 5px;}
#header .head_nav .up_nav a{transition: .3s;}
#header .head_nav .up_nav a:hover{text-decoration: underline !important;}
#header .head_nav .up_nav a i{margin-left: 7px; margin-right: 7px;}
#header .head_nav .under_nav ul{display: flex;}
#header .head_nav .under_nav ul li{margin: 0 12px; letter-spacing: 1.5px;}
#header .head_nav .under_nav ul li > a{padding-bottom: 15px;}
#header .head_nav .under_nav ul li > a:hover{color: #fff;}
#header.fixed .head_nav .under_nav ul li > a:hover{color: #1F286F;}
#header .head_nav .under_nav ul li:hover > a{border-bottom: 3px solid #F39800;}
#header  .head_nav .under_nav a:last-of-type{margin-right: 0;}

/* header-dropdown */
#header .drop-menu{opacity: 0; position: absolute; top: 97px; left: 0; width: 100%; transition: .3s; visibility: hidden; padding-top: 5px;}
#header .drop-menu.show{opacity: 1; visibility: visible;}
#header .drop-menu .drop_inner{display: flex;}
#header .drop_inner .left_tit{width: 25%; background-color: #1F286F;}
#header .drop_inner .left_tit .wrp_content{max-width: 300px; margin: 40px auto 0;}
#header .drop_inner .left_tit .sub{color: #F39800; margin-bottom: 10px;}
#header .drop_inner .left_tit .main{color: #fff; font-size: 38px; line-height: 1; margin-bottom: 15px; font-weight: 500;}
#header .drop_inner .left_tit .arrow{border-radius: 50%; background-color: #586196; padding: 15px 17px; line-height: 1; display: inline-block;}
#header .drop_inner .left_tit .arrow i{color: #fff; margin-right: 0; font-size: 24px;}
#header .drop_inner .right_nav{width: 75%; background-color: #fff; padding: 40px 0px;}
#header .drop_inner .right_nav .grid{max-width: 950px; margin: 0 auto; padding: 0 15px;}
#header .drop_inner .right_nav a{display: block;}
#header .drop_inner .right_nav a:hover .d_tit::after{right: 0;}
#header .right_nav .drop_item{margin-bottom: 20px;}
#header .right_nav .drop_item img{margin-bottom: 10px;}
#header .right_nav .drop_item .d_tit{color: #1F286F; font-weight: 500; font-size: 18px; padding-left: 10px; border-left: 3px solid #F39800; position: relative;}
#header .right_nav .drop_item .d_tit::after{position: absolute; font-family: "Font Awesome 5 Free"; content: "\f061"; font-weight: 900; top: 0; bottom: 0; right: 10px; margin: auto; width: 20px; height: 25px; color: #5F6698; transition: .3s;}

/* header-lang */
#header .head_nav .up_nav .up_item{position: relative;}
#header .drop-lang{opacity: 0; position: absolute; top: 0px; left: 0; right: 0; margin: auto; padding-top: 30px; visibility: hidden; transition: .3s;}
#header .drop-lang.show{opacity: 1; visibility: visible; transition: .3s;}
#header .drop-lang .lang_inner{padding: 17px 17px 20px; background-color: #fff;}
#header .drop-lang .lang_inner a{color: #1F286F; margin-bottom: 15px; line-height: 1;}
#header .drop-lang .lang_inner a:last-of-type{margin-bottom: 0;}
#header .drop-lang .lang_inner .active{color: #F39800;}
#header .head_nav .up_nav .bogo-language-switcher{flex-direction: column;}
#header .head_nav .up_nav .bogo-language-switcher .ja {order: 1;}
#header .head_nav .up_nav .bogo-language-switcher .en-US {order: 2;}
#header .head_nav .up_nav .bogo-language-switcher .zh-TW {order: 3;}
#header .head_nav .up_nav .bogo-language-switcher li{margin-bottom: 15px; line-height: 1; width: 100%;}
#header .head_nav .up_nav .bogo-language-switcher li .current{color: #F39800;}
#header .head_nav .up_nav .bogo-language-switcher li:last-of-type{margin-bottom: 0;}
.bogo-language-switcher .zh-CN{display: none;}
.bogo-language-switcher .bogoflags{display: none;}

/*--- public ---*/
/* section */
.sec_inner{padding: 70px 0; position: relative;}
.sec_tit{margin-bottom: 30px; text-align: center; font-weight: 500;}
.sec_tit .sub{color: #F39800; font-weight: normal;}
.sec_tit .main{color: #1F286F; font-size: 38px;}
.sec_tit h2.main{margin-bottom: 0; line-height: 1.7;}

/* bg */
.bg_blue{background-color: #e5eef7;}
.bg_blue2{background-color: #D2E7FD;}

/* my_card */
.card_box{justify-content: center; flex-wrap: wrap; display: flex;}
.card_box.in_corporate{border-bottom: 1px solid #CCCCCC;}
.card_box .my_card{width: 31%; max-width: 350px; margin: 0 1% 40px; display: block;}
@media only screen and (min-width: 768px) {
  .card_box.card_box-2col {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
  }
  .card_box.card_box-2col .my_card {
    width: 50%;
  }
}
.my_card .item_img{margin: 0 40px; overflow: hidden; border-radius: 50%;}
.my_card .item_img img{transition: .3s; border-radius: 50%;}
.my_card:hover .item_img img{transition: .3s; transform:scale(1.2,1.2);}
.my_card .item_content{padding: 150px 15px 15px; background-color: #1F286F; color: #fff; margin-top: -130px;}
.my_card.bg_right_blue .item_content{background-color: #005BAC;}
.my_card .item_tit{margin-bottom: 20px; display: flex; align-items: center; justify-content: space-between; min-height: 58px;}
.my_card .item_tit .tit{font-size: 24px; font-weight: 500; line-height: 1.2;}
.my_card .item_tit .arrow{border-radius: 50%; background-color: #586196; padding: 15px 17px; line-height: 1; transition: .3s;}
.my_card:hover .item_tit .arrow{margin-right: -10px;}
.my_card .item_tit .arrow i{color: #fff; margin-right: 0; font-size: 24px;}
.my_card .item_text{min-height: 55px;}


/* dual_box */
.wrp_dual{display: flex; justify-content: space-between; align-items: center;}
.wrp_dual .item{width: 49%;}
.wrp_dual .btn_box{text-align: left; margin-top: 40px;}

/* bread */
.wrp_bred{padding-top: 20px;}
.wrp_bred span{display: inline-block; font-size: 13px;}
.wrp_bred > .container > div{display: flex; flex-wrap: wrap;}
.wrp_bred > .container > div > span{margin: 0 10px; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; line-height: 2;}
.wrp_bred > .container > div > span:first-of-type{margin-left: 0;}
.wrp_bred, .wrp_bred a{color: #CCCCCC;}
.wrp_bred a:hover{color: #1F286F;}
.wrp_bred > .container > div > span > span{color: #1F286F; font-weight: 700;}

/* fix_page */
.fix_kv{position: relative;}
.fix_kv .kv_tit{position: absolute; max-width: 1320px; padding: 0 15px; bottom: 70px; left: 0; right: 0; margin: 0 auto;}
.fix_kv .kv_tit .sub{color: #F39800; font-size: 24px; font-weight: normal;}
.fix_kv .kv_tit .main{color: #fff; font-size: 48px; line-height: 1; margin-bottom: 0; font-weight: 500;}


/* fix_input */
.wrp_form{max-width: 900px; margin: 0 auto 70px;}
.wrp_form .form_h2 h2{color: #1F286F; font-weight: bold; letter-spacing: 2px;}
.wrp_form .text{margin-bottom: 60px; font-size: 14px; line-height: 2;}
.wrp_form .text .chui{padding-left: 15px; position: relative;}
.wrp_form .text .chui::before{content: '*'; color: #F39800; top: 0; left: 0; position: absolute; font-size: 18px;}
.wrp_form .item{margin-bottom: 40px;}
.wrp_form .item .name{color: #1F286F; font-weight: 600; margin-bottom: 10px; position: relative; letter-spacing: 2px; display: inline-block;}
.wrp_form .item .name.hissu::after{position: absolute; content: '*'; color: #F39800; top: -2; right: -15px; font-size: 18px;}
.wrp_select{position: relative;}
.wrp_select::after{position: absolute; font-family: "Font Awesome 5 Free"; content: "\f107"; font-weight: 900; top: 0; bottom: 0; right: 0px; color: #fff; background-color: #1F286F; padding: 12px 30px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; font-size: 21px; z-index: -1;}
.wrp_select select{width: 100%; border: 1px solid #ccc; padding: 15px 15px; border-radius: 5px; background-color: transparent; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-weight: 300;}
.wrp_input input{width: 100%; border: 1px solid #ccc; padding: 15px 15px; border-radius: 5px; letter-spacing: 1.5px; font-weight: 300;}
.wrp_input input::placeholder{color: #afafaf;}
.wrp_input textarea{width: 100%; border: 1px solid #ccc; padding: 15px 15px; border-radius: 5px; font-weight: 300;}
.wrp_form .wpcf7-spinner{display: block; margin: 0 auto;}
.wrp_form .pub_btn{background-color: #fff;}
.wrp_chui{margin-top: 70px;}
.wrp_chui.ajust{margin-top: 40px; padding-bottom: 10px; border-bottom: 1px solid #ccc; margin-bottom: 50px;}
.wrp_chui .item{margin-bottom: 30px;}
.wrp_chui .item .name{color: #1F286F; font-weight: 600; line-height: 1;}
.wrp_chui .item ul li{line-height: 2; padding-left: 20px; position: relative;}
.wrp_chui .item ul li::before{position: absolute; content: '◯'; top: 0; left: 0;}
.wrp_chui .item ul li a{text-decoration: underline !important; color: #191919; font-weight: 300;}


/* 404 */
.box_404{max-width: 900px; margin: 0 auto 70px;}
.box_404 > span{margin-top: 40px; padding-bottom: 40px; border-bottom: 1px solid #ccc; margin-bottom: 50px;}


/* btn */
.btn_box{text-align: center;}
.pub_btn{display: inline-block; border: 2px solid #1F286F; color: #1F286F; border-radius: 30px; text-align: center; padding: 8px 0; width: 250px; position: relative; transition: .3s;}
@media only screen and (min-width: 768px) {
  .pub_btn.pub_btn-2 {
    width: 280px;
  }
}
.pub_btn:hover{background-color: #1F286F; color: #fff;}
.pub_btn::after{position: absolute; font-family: "Font Awesome 5 Free"; content: "\f105"; font-weight: 900; top: 0; bottom: 0; right: 10px; margin: auto; width: 20px; height: 25px;}
.btn_box.in_corporate{margin-top: 40px;}
.en .pub_btn{font-size: 14px;}


/*--- top ---*/
/* mv */
.mv{position: relative; height: 100vh; width: 100%; overflow: hidden;}
.mv::after{content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.2);}
/* .mv iframe{width: 100%; height: 120%; margin-top: -10%;} */
.mv_ab{position: absolute; top: 0; bottom: 0; left: 0; margin: auto; width: 100%; height: 85px; z-index: 9;}
.mv_ab .p-tit{color: #fff; font-weight: 500; font-size: 42px; text-align: center; line-height: 2; margin-bottom: 0; letter-spacing: 4px; text-indent: 4px}
.mv_ab .p-tit{ display: flex; overflow: hidden; justify-content: center; flex-wrap: wrap; letter-spacing: 4px;}
.iframe_re{padding: 56.25% 0 0 0; position: relative;}
.iframe_re iframe{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans&display=swap');
.mv_ab .p-tit span {display: block; transform: translate(0, 105%); transition: transform cubic-bezier(0.215, 0.61, 0.355, 1) 0.5s;}
.mv_ab .p-tit.-visible span {transform: translate(0, 0);}
.mv_ab .p-tit span:nth-child(2) {transition-delay: 0.08s;}
.mv_ab .p-tit span:nth-child(3) {transition-delay: 0.14s;}
.mv_ab .p-tit span:nth-child(4) {transition-delay: 0.20s;}
.mv_ab .p-tit span:nth-child(5) {transition-delay: 0.26s;}
.mv_ab .p-tit span:nth-child(6) {transition-delay: 0.32s;}
.mv_ab .p-tit span:nth-child(7) {transition-delay: 0.38s;}
.mv_ab .p-tit span:nth-child(8) {transition-delay: 0.44s;}
.mv_ab .p-tit span:nth-child(9) {transition-delay: 0.50s;}
.mv_ab .p-tit span:nth-child(10) {transition-delay: 0.56s;}
.mv_ab .p-tit span:nth-child(11) {transition-delay: 0.62s;}
.mv_ab .p-tit span:nth-child(12) {transition-delay: 0.68s;}
.mv_ab .p-tit span:nth-child(13) {transition-delay: 0.74s;}
.mv_ab .p-tit span:nth-child(14) {transition-delay: 0.80s;}
.mv_ab .p-tit span:nth-child(15) {transition-delay: 0.86s;}
.mv_ab .p-tit span:nth-child(16) {transition-delay: 0.92s;}
.mv_ab .p-tit span:nth-child(17) {transition-delay: 0.98s;}
.mv_ab .p-tit span:nth-child(18) {transition-delay: 1.04s;}


/* service */
.wrp_service{position: relative; max-width: 1500px; margin: 0 auto; padding-bottom: 50px;}
.service{width: 60%; background-color: #1F286F; color: #fff; padding: 50px 0; padding-left: 10%;}
.service .sec_tit{text-align: left;}
.service .sec_tit .main{color: #fff;}
.service .content{margin-bottom: 40px; line-height: 2;}
.service_img{position: absolute; right: 0; bottom: 0; width: 50%; text-align: right;}
.service_img img{max-height: 450px;}
.service .btn_box{text-align: left;}
.service .btn_box .pub_btn{color: #fff; border: 2px solid #fff; transition: .3s;}
.service .btn_box .pub_btn:hover{background-color: #fff; color: #1F286F;}

/* news */
.news_box{margin-bottom: 50px;}
.news_box .news_item{padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px solid #E2E2E2;}
.news_box .news_item:first-of-type{border-top: 1px solid #E2E2E2; padding-top: 30px;}
.news_box .news_item a{display: flex; color: #333333;}
.news_box .news_item a .news_left{display: flex; width: 87%; transition: .3s;}
.news_box .news_item a:hover .news_left{opacity: .6;}
.news_box .news_item a .news_img{width: 13%; text-align: center; height: 0; padding-bottom: 13%; overflow: hidden; position: relative;}
.news_box .news_item a .news_img > img{object-fit: cover; width: 100%; height: 100%; position: absolute; top: 0; left: 0; transition: .3s;}
.news_box .news_item a:hover .news_img > img{transform:scale(1.2,1.2); transition: .3s;}
.news_box .news_item a .news_img .play_icon{position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; width: 45px; height: 45px; z-index: 5;}
.news_left .day{width: 13%; padding-right: 10px; letter-spacing: 2px;}
.news_left .cat{width: 13%; text-align: center;}
.news_left .cat span{display: inline-block; background-color: #1F286F; color: #fff; font-size: 12px; padding: 3px 0; width: 130px;}
.news_left .title{width: 74%; padding: 0 30px;}

/* about */
.wrp_about .content{margin-bottom: 50px;}

/* global */
.globe_bg{background-image: url(assets/images/m02.svg); background-size: contain; background-repeat: no-repeat; background-color: rgba(0, 91, 172, 0.1); background-position: center;}

/* sdgs */
.top_sdgs .right_box{max-width: 50%; padding: 50px 0;}
.top_sdgs .right_box .sec_tit{text-align: left;}
.top_sdgs .right_box .item{padding-right: 50px;}
.top_sdgs .right_box .btn_box{margin-top: 40px; text-align: left;}
.top_sdgs .left_img{position: absolute; top: 0; bottom: 0; margin: auto; left: 50%; max-width: 50%; max-height: 390px;}
.top_sdgs .left_img img{max-height: 390px;}

/* media */
.wrp_media .text{margin-bottom: 40px;}
.wrp_media .btn_box i{margin-left: 5px;}
.media_box{margin-bottom: 40px;}
.media_box .item{background-color: #fff; padding: 20px; display: block;}
.media_box .item_img{margin-bottom: 10px; position: relative; overflow: hidden;}
.media_box .item .item_img > img{transition: .3s;}
.media_box .item:hover .item_img > img{transform:scale(1.2,1.2); transition: .3s;}
.media_box .item_img .play_icon{position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; width: 45px; height: 45px; z-index: 5;}
.media_box .item_tit{color: #333333;}

/* modal */
.md-overlay{display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: .7; z-index: 25;}
.md-contents{display: none; position: fixed; top: 0; bottom: 0; margin: auto; left: 50%; width: 850px; height: 590px; transform: translateX(-50%); z-index: 30; background-color: #fff; padding: 30px 30px;}
.md-contents .wrp_content{position: relative;}
.md-contents .wrp_content .close_btn{display: block; position: absolute; top: -80px; right: -30px; z-index: 40; color: #fff; font-size: 40px; line-height: 1; cursor: pointer;}
.md-contents .wrp_content .close_btn i{margin-right: 0;}
.md-contents .wrp_iframe{margin-bottom: 20px;}
.md-contents .wrp_iframe iframe{width: 100%; height: 445px;}
.md-contents .box_title{font-size: 18px; font-weight: 500; color: #1F286F;}


/* contact */
.wrp_contact{position: relative; padding-top: 100px; max-width: 1500px; margin: 0 auto;}
.contact_img{position: absolute; top: 0; left: 10%;}
.contact_img img{max-width: 350px;}
.contact{width: 55%; background-color: #1F286F; color: #fff; padding: 50px 50px; margin-left: auto;}
.contact .sec_tit,
.contact .btn_box
{text-align: left;}
.contact .sec_tit .main{color: #fff;}
.contact .content{margin-bottom: 40px; line-height: 2;}
.contact .btn_box .pub_btn{color: #fff; border: 2px solid #fff; transition: .3s;}
.contact .btn_box .pub_btn:hover{background-color: #fff; color: #1F286F;}

/* recruit */
.recruit_bg{background-image: url(assets/images/r02.png); background-size: cover; background-repeat: no-repeat; background-color: rgba(0, 91, 172, 0.1); background-position: center;}

/* shop */
.top_shop .sec_tit{text-align: left;}
.top_shop .btn_box i{margin-left: 5px;}


/*--- footer ---*/
.foot_inner{background-color: #005BAC; color: #fff; padding: 70px 0; font-size: 14px;}
.foot_logo{text-align: center; margin-bottom: 20px;}
.foot_logo a{display: inline-block; transition: .3s;}
.foot_logo a:hover{opacity: .7;}
.foot_logo img{max-width: 200px;}
.foot_inner ul{display: flex; align-items: center; justify-content: center; flex-wrap: wrap;}
.foot_inner ul li{margin: 0 15px;}
.foot_inner a{color: #fff; display: block; transition: .3s;}
.foot_inner a:hover{text-decoration: underline !important; transition: .3s;}
.foot_sns{margin-bottom: 40px;}
.foot_sns img{max-height: 25px;}
.foot_sns a:hover{opacity: 0.6;}
.foot_nav{margin-bottom: 40px;}
.foot_link{display: flex; align-items: center; flex-wrap: wrap; justify-content: center;}
.foot_link ul{margin-right: 15px; margin-bottom: 0;}
.foot_link i{margin-left: 5px;}
.foot_link .lang a{display: inline-block; margin: 0 10px;}
.foot_link .lang .ja a{margin-left: 5px;}
.foot_link .lang span{display: inline-block;}
.copy{background-color: #1F286F; color: #fff; line-height: 1; font-size: 12px; padding: 10px 0;}
.copy a{color: #fff;}

.foot_inner .bogo-language-switcher .bogoflags{display: none;}
.foot_inner .bogo-language-switcher{display: flex; margin: 0 0;}
.foot_inner .bogo-language-switcher li{margin: 0 0;}
.foot_inner .bogo-language-switcher li::after{content: '/';}
.foot_inner .bogo-language-switcher li:last-of-type::after{display: none;}
.foot_inner .bogo-language-switcher .ja {order: 1;}
.foot_inner .bogo-language-switcher .en-US {order: 2;}
.foot_inner .bogo-language-switcher .zh-TW {order: 3;}

/* fix_btn */
.fix_btn{position: fixed; bottom: 50px; left: 40px; width: 100px; height: 100px; border-radius: 50%; background-color: #fff; z-index: 24; border: solid 2px #1F286F; text-align: center; color: #1F286F; padding-top: 10px; display: block; transition: .3s;}
.fix_btn:hover{background-color: #1F286F; color: #fff;}
.fix_btn span{font-size: 14px; line-height: 1.2; margin-bottom: -5px;}
.fix_btn .fa-shopping-cart{font-size: 24px; margin-right: 0;}
.fix_btn .fa-external-link{font-size: 12px; margin-right: 0;}

/*------PC3------*/
@media only screen and (max-width: 1580px) {


}

/*------PC2------*/
@media only screen and (max-width: 1440px) {

  /* header */
  #header .head_nav .under_nav ul li{margin: 0 5px;}


}

/*------PC3------*/
@media only screen and (max-width: 1367px) {

  .mv{height: 75vh;}
  .iframe_re iframe{width: 120%; left: -10%;}
  .iframe_re{padding-top: 65%;}

  /* sdgs */
  .top_sdgs .right_box .item{padding-right: 30px;}
  .top_sdgs .left_img{left: auto; right: 0;}

}

/*------PC3------*/
@media only screen and (max-width: 1200px) {


}


/*---PAD pro---*/
@media only screen and (max-width: 1050px) {

  /* header */
  #header .head_logo img{padding-right: 15px;}
  #header .head_logo > a span{padding-left: 15px;}
  #header .head_logo img{max-width: 150px;}

  /* mv */
  .mv_ab .p-tit{font-size: 33px;}
  .mv{height: 45vh;}

  /* fix_page */
  .fix_kv .kv_tit{bottom: 20px;}
  .fix_kv .kv_tit .sub{font-size: 18px;}
  .fix_kv .kv_tit .main{font-size: 36px;}


  /*--- top ---*/
  /* service */
  .service{padding-left: 5%;}

  /* news */
  .news_left .day{width: 15%;}
  .news_left .cat{width: 15%;}
  .news_left .title{width: 70%;}
  .news_left .cat span{width: 100px;}

  /* modal */
  .md-contents{width: 750px; height: 530px;}
  .md-contents .wrp_iframe iframe{height: 390px;}

  /* sdgs */
  .top_sdgs .right_box{padding: 0 0;}
  .top_sdgs .left_img{max-height: 340px;}

  /* contact */
  .contact_img{left: 5%;}

  /* footer */
  .foot_inner ul li{margin: 0 10px;}


}

/*---PAD---*/
@media only screen and (max-width: 880px) {
  body{font-size: 14px;}
  .pad_block{display: block;}

  /* オフキャンバス */
  .m-toggle{border: none; display: block; position: relative; background: none; z-index: 9999; outline: none !important;}
  .offcanvas-toggle .icon-bar{background: white;}
  .fixed .offcanvas-toggle .icon-bar{background: #1F286F;}
  .icon-bar{display:block; width:30px; height:3px; border-radius:1px; margin: auto;}
  .icon-bar + .icon-bar{margin-top:10px}
  .offcanvas-toggle.is-open .icon-bar{background: white;}
  .offcanvas-toggle.is-open .icon-bar:nth-child(3){margin-top: 14px;}
  .offcanvas-toggle.is-open .icon-bar:nth-child(4){transform: rotate(-135deg) translate(8px, 8px); margin-top: 2px;}
  .off-base.navbar-offcanvas{top: 0; overflow: auto; z-index: 999;}
  .offcanvas-toggle .icon-bar:nth-child(4){display: none;}
  .offcanvas-toggle.is-open .icon-bar:nth-child(4){display: block;}
  .off-base.navbar-offcanvas .head_logo{padding: 20px 20px; margin-bottom: 10px;}
  #header .off-base.navbar-offcanvas .head_lang .lang a{display: inline-block; margin: 0 10px;}
  #header .off-base.navbar-offcanvas .head_lang .lang span{display: inline-block;}

  /*offcanvas-size*/
  .navbar-offcanvas{max-width: 100%; position: fixed; width: 100%; height: 100%; background-color:#005BAC; overflow-y: scroll;}
  .navbar-offcanvas.navbar-offcanvas-right {right: -100%;}
  .navbar-offcanvas.navbar-offcanvas-right.offcanvas-transform.in {-webkit-transform: translateX(-100%); transform: translateX(-100%);}

  .sm-nav-box ul{margin-top: 20px; margin-bottom: 20px; padding-left: 0;}
  .sm-nav-box ul li{position: relative;}
  #sm-offcanvas > ul > li{padding: 0 15px;}
  .sm-nav-box li a{display: block; padding: 15px; font-weight: bold; font-size: 13px; color: white; border-bottom: solid 1px #ccc;}
  #sm-offcanvas > ul > li:first-of-type a{border-top: 1px solid #ccc;}
  .sm-nav-box .poz{position: absolute; top: 40%; right: 5%; color: #9f9f9f;}
  .top-bor-nav{border-top: solid 1px #ccc;}
  .ad_nav{text-align: center; margin-bottom: 15px;}
  .ad_nav i{margin: 0 5px;}
  .sm-nav-box ul .sm_drop_menu{height: 0; opacity: 0; visibility: hidden; transition: .3s; animation-duration: .3s; background-color: #719EC7; margin-top: 0; margin-bottom: 0; margin-right: -15px; margin-left: -15px;}
  .sm-nav-box ul .active > .sm_drop_menu{height: auto; display: block; opacity: 1; visibility: visible; transition: .3s; animation-duration: .3s;}
  .sm_drop_menu li{padding-left: 15px; padding-right: 15px;}
  .sm_drop_menu li a{display: block; position: relative; padding: 15px 15px; padding-left: 30px; font-weight: bold; font-size: 13px; color: white; border-bottom: solid 1px #ccc;}
  .sm_drop_menu li a::before{content: ''; position: absolute; top: 0; bottom: 0; left: 5px; border-top: solid 1px #fff; width: 12px; height: 1px; margin: auto;}
  .sm_drop_menu li.last a{border-bottom: 0px solid #000;}
  .sm-nav-box ul .active > a{border-bottom: 0px;}
  #header.fixed #sm-offcanvas a{color: #fff;}
  #header.fixed .head_logo > a span{border-left: 1px solid #fff;}
  .sm_drop .plus_drop > a::after{position: absolute; font-family: "Font Awesome 5 Free"; content: "\f067"; font-weight: 900; top: 0; bottom: 0; right: 15px; margin: auto; width: 20px; height: 25px;}
  .sm_drop .plus_drop.active > a::after{content: "\f068"; bottom: auto; top: 15px;}

  .ham_sns ul{display: flex; align-items: center; justify-content: center; flex-wrap: wrap;}
  .ham_sns ul li{margin: 0 15px;}
  .ham_sns ul li a{border-bottom: 0px; padding: 0;}
  .ham_sns{margin-bottom: 30px; margin-top: 40px;}
  .ham_sns img{max-height: 25px;}


  #header .off-base.navbar-offcanvas .head_lang .lang .bogo-language-switcher .bogoflags{display: none;}
  #header .off-base.navbar-offcanvas .head_lang .lang .bogo-language-switcher{display: flex; margin: 0 0;}
  #header .off-base.navbar-offcanvas .head_lang .lang .bogo-language-switcher li::after{content: '/';}
  #header .off-base.navbar-offcanvas .head_lang .lang .bogo-language-switcher li:last-of-type::after{display: none;}
  #header .off-base.navbar-offcanvas .head_lang .lang .bogo-language-switcher .bogo-language-name a{padding: 0; border-bottom: 0px;}
  #header .off-base.navbar-offcanvas .head_lang .lang .bogo-language-switcher .ja {order: 1;}
  #header .off-base.navbar-offcanvas .head_lang .lang .bogo-language-switcher .en-US {order: 2;}
  #header .off-base.navbar-offcanvas .head_lang .lang .bogo-language-switcher .zh-TW {order: 3;}


  /*--- header ---*/
  #header .head_nav{display: none;}

  /*--- public ---*/
  /* section */
  .sec_tit .main{font-size: 30px;}

  /* card */
  .my_card .item_tit{min-height: 50px;}
  .my_card .item_img{margin: 0 20px;}
  .my_card .item_content{padding-top: 100px; margin-top: -80px;}
  .my_card:hover .item_img img{transform: none;}

  /*--- top ---*/

  /* .mv{height: 35vh;} */

  /* service */
  .service{padding-left: 15px;}

  /* news */
  .news_box .news_item a .news_left{flex-wrap: wrap;}
  .news_left .day{width: 20%;}
  .news_left .cat{width: 25%;}
  .news_left .title{width: 100%; padding-left: 0; padding-right: 15px;}
  .news_left .cat span{width: auto; padding: 3px 15px;}

  /* company */
  .my_card .item_tit .tit{font-size: 18px;}
  .my_card .item_tit .arrow{padding: 10px 12px;}
  .my_card .item_tit .arrow i{font-size: 18px;}

  /* media */
  .media_box .item{padding: 15px;}

  /* sdgs */
  .top_sdgs .left_img{max-height: 270px;}

  /* contact */
  .contact_img{left: 15px;}
  .contact_img img{max-width: 300px;}
  .contact{padding: 40px 30px;}

  /* fix_btn */
  .fix_btn{left: 15px; bottom: 10px;}

  .foot_link ul{margin-right: 5px;}


}

/*---Sm---*/
@media only screen and (max-width: 767px) {

  /*--- header ---*/
  #header .head_inner{padding: 15px 10px;}
  /* #header .head_logo img{max-width: 120px;} */
  #header .head_logo img{max-width: 100px;}
  #header .head_logo img{padding-right: 5px;}
  #header .head_logo > a span{padding-left: 5px; font-size: 10px;}
  #header .head_logo > a span.ajust_en{font-size: 9px;}
  #header .head_logo > a span h1{font-size: 10px;}
  .off-base.navbar-offcanvas .head_logo{padding: 15px 10px;}
  #header .off-base.navbar-offcanvas .head_lang .lang a{font-size: 12px; margin: 0 5px;}
  #header .off-base.navbar-offcanvas .head_lang .name{font-size: 12px; padding-top: 3px;}
  .navbar-offcanvas{padding-right: 0 !important; padding-left: 0 !important;}

  /*--- public ---*/
  .grid-3 {grid-template-columns:1fr;}

  /* card */
  .card_box{padding: 0 15px;}
  .my_card .item_img{margin: 0 30px;}
  .card_box .my_card{width: 100%; margin: 0 0 40px;}
  .my_card .item_content{padding-top: 90px;}
  .my_card .item_tit{margin-bottom: 10px;}

  /* section */
  .sec_inner{padding: 50px 0;}
  .sec_inner.ajust0{padding: 0;}
  .sec_tit .main{font-size: 27px;}

  /* dual_box */
  .wrp_dual{flex-wrap: wrap;}
  .wrp_dual .item{width: 100%; margin-bottom: 20px;}
  .wrp_dual .btn_box{text-align: center; margin-top: 30px;}

  /* bread */
  .wrp_bred > .container > div > span{margin: 0 5px;}

  /* contact */
  .wrp_contact{padding-top: 0;}
  .contact{width: 100%; padding: 40px 20px;}
  .contact_img{display: none;}
  .contact .sec_tit, .contact .btn_box{text-align: center;}
  .wrp_bred > .container > div > span{line-height: 1.7;}

  /* mv */
  .mv{height: 55vh; margin-bottom: -40px;}
  .mv_ab{height: 110px;}
  .mv_ab .p-tit{font-size: 27px;}
  .mv_ab .p-tit{display: none;}
  .iframe_re{padding: 55vh 0 0 0;}
  .iframe_re iframe{width: 220%; margin-left: -60%; left: 0;}

  /* fix_page */
  .fix_kv .kv_tit .sub{font-size: 16px;}
  .fix_kv .kv_tit .main{font-size: 33px;}

  /* fix_input */
  .wrp_form .item{margin-bottom: 30px;}
  .wrp_select::after{font-size: 15px; padding: 15px 20px;}

  /* btn */
  .btn_box .pub_btn{width: 220px; padding: 7px 0;}

  /*--- top ---*/
  /* service */
  .service{width: 100%; padding-right: 10px; padding-bottom: 200px;}
  .wrp_service{padding-bottom: 100px;}
  .service .content{margin-bottom: 20px;}
  .service .sec_tit ,.service .btn_box{text-align: center;}
  .service_img{width: 100%; padding: 0 15px;}

  /* news */
  .news_box .news_item a .news_left{width: 80%;}
  .news_left .day{width: 35%;}
  .news_left .cat{width: 50%;}
  .news_left .cat span{font-size: 10px;}
  .news_box .news_item a .news_img{width: 20%;}
  .news_left .day{letter-spacing: 1px;}
  .news_left .title{margin-top: 15px; padding-right: 10px; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3;}
  .news_box .news_item a{align-items: flex-end;}
  .news_box .news_item a .news_img .play_icon{width: 20px; height: 20px;}

  /* modal */
  .md-contents{width: 320px; height: 300px; padding: 20px 15px;}
  .md-contents .wrp_iframe{margin-bottom: 10px;}
  .md-contents .wrp_iframe iframe{height: 165px;}
  .md-contents .box_title{font-size: 16px;}
  .md-contents .wrp_content .close_btn{top: -60px; right: -15px; font-size: 30px;}

  /* sdgs */
  .top_sdgs .right_box{max-width: 100%; margin-bottom: 20px;}
  .top_sdgs .right_box .item{padding-right: 0;}
  .top_sdgs .left_img{max-height: none; max-width: 100%; position: static; padding: 0 .75rem;}
  .top_sdgs .left_img img{max-height: none; margin-bottom: 30px;}

	  /* company */
	.wrp_company .grid-4{grid-template-columns: 1fr;}
	
	
  /* recruit */
  .recruit_bg .wrp_dual{flex-wrap: wrap-reverse;}

  /* shop */
  .top_shop .sec_tit{text-align: center;}

  /*--- footer ---*/
  .foot_inner ul li{margin: 0 15px 20px;}
  .foot_logo{margin-bottom: 40px;}
  .foot_sns img{max-height: 20px;}
  .foot_nav ul{max-width: 300px; margin: 0 auto;}
  .foot_link ul{margin-right: 0;}
  .foot_link ul li{margin: 0 5px 20px;}
  .copy{text-align: center; padding: 25px 0 100px;}
  .copy a{width: 100%; padding-bottom: 20px; border-bottom: 1px solid #fff; margin-bottom: 20px;}
  .copy span{width: 100%;}

  /* fix_btn */
  .fix_btn{width: 90px; height: 90px; left: 10px;}
  .fix_btn span{font-size: 12px;}
  .fix_btn .fa-shopping-cart{font-size: 21px;}
  .fix_btn .fa-external-link{font-size: 11px;}


}

/*---Sm small---*/
@media only screen and (max-width: 350px) {

  .mv_ab h1{font-size: 24px;}
  .sec_tit .main{font-size: 24px;}
  #header .head_logo > a span{font-size: 8px;}
  #header .head_logo > a span h1{font-size: 8px;}
  .iframe_re iframe{width: 250%; margin-left: -75%;}
  .foot_link ul li{font-size: 12px;}
  .foot_link .name{font-size: 12px;}

}


.news_icon {
  width: 20px;
  height: 20px;
  object-fit: contain;
  display: inline-block;
  vertical-align: middle;
  position: relative;
  top: -2px;
  margin-left: 5px;
}