@charset "utf-8";
/* ===================================================================
CSS information

 file name  : sp.css
 style info : スマートフォン用
=================================================================== */

@media screen and (max-width: 1024px){
  
  /* -----------------------------------------------------------
      toggle-panel
  ----------------------------------------------------------- */
  #panel-btn {
    display: block;
    flex: 0 1 56px;
    -webkit-flex: 0 1 56px;
    width: 56px;
    height: 38px;
    cursor: pointer;
    z-index: 1000;
    position: relative;
  }

  #panel-btn:hover {
    opacity: 1;
  }

  #panel-btn-icon {
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    width: 56px;
    height: 4px;
    margin: -1px 0 0 -7px;
    background: #454545;
    transition: .2s;
  }

  #panel-btn-icon:before,
  #panel-btn-icon:after {
    display: block;
    content: "";
    position: absolute;
    right: 0;
    width: 56px;
    height: 4px;
    margin-left: 0;
    background: #3f3a39;
    transition: .3s;
  }

  #panel-btn-icon:before {
    top: -8px;
  }

  #panel-btn-icon:after {
    bottom: -8px;
  }
  #panel-btn .close:before,
  #panel-btn .close:after {
    margin-top: 0;
    background: #000;
  }
  #panel-btn .close:before {
    background: #000;
    top: 0;
  }
  #panel-btn .close:after {
    background: #000;
    bottom: 0;
  }

  #panel-btn .close {
    background: transparent;
  }

  #panel-btn .close:before {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
  }

  #panel-btn .close:after {
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
  }
  #g_nav {
    position: fixed;
    width: 250px;
    top: 0;
    right: 0;
  }
  #g_nav ul {
    overflow: hidden;
    -webkit-transition-duration: .8s;
    transition-duration: .8s;
    -webkit-transition-timing-function: cubic-bezier(.23,1,.32,1);
    transition-timing-function: cubic-bezier(.23,1,.32,1);
    max-width: 250px;
    width: 100%;
    position: absolute;
    right: -250px;
    top: 100px;
    background: #fff;
    display: block;
  }
  .open #g_nav ul {
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    -webkit-transition-duration: .8s;
    transition-duration: .8s;
    right: 0;
  }
  #g_nav ul li a {
    padding: 15px 30px;
    border-top: 1px solid #000;
    color: #000;
    display: block;
    position: relative;
  }
  #g_nav ul li a:before {
    content: "\f105";
    font-family: FontAwesome;
    position: absolute;
    top: 50%;
    right: 30px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
  }
  #g_nav ul li:last-of-type a {
    border-bottom: 1px solid #000;
  }
  #g_nav ul li.search_ico {
    display: none;
  }
  header #g_nav ul li:nth-of-type(n+2) {
    margin: 0 0 0 0;
  }
  .btn_en {
    display: none;
  }
  header {
    height: 100px;
    min-height: 100px;
  }
  header .inner {
    justify-content: space-around;
    -webkit-justify-content: space-around;
    height: 100%;
    padding: 0 5%;
  }
  header #g_nav {
    margin: 0 0 0;
  }
  header #g_nav ul {
    display: block;
  }
  .search {
    display: block;
    flex: 0 1 45px;
    -webkit-flex: 0 1 45px;
  }
  header .inner figure {
    flex: 1 1;
    -webkit-flex: 1 1;
    margin: 0 -2% 1% 4%;
    text-align: center;
  }
  .sp {
    display: block;
  }
  main {
    margin: 100px 0 0;
  }
  /* -----------------------------------------------------------
      パンくず
  ----------------------------------------------------------- */
  .breadcrumbs-wrap {
    padding: 2.5% 5%;
  }
  .breadcrumbs-wrap__content {
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
  }

  /* -----------------------------------------------------------
      トップページ
  ----------------------------------------------------------- */
  #top .main_wrap {
    margin: 5% auto 0;
  }
  #top .main_wrap > ul {
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    margin: 5% 0 0;
    padding: 0 5%;
  }
  #top .main_wrap > ul li {
    flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    width: calc(100% / 2 - 2.5%);
  }
  #top .main_wrap > ul li:nth-of-type(n+2) {
    margin: 0 0 0 0;
  }
  #top .main_wrap > ul li:nth-of-type(2n) {
    margin: 0 0 0 5%;
  }
  #top .main_wrap > ul li:nth-of-type(n+3) {
    margin-top: 5%;
  }
  #top .aside_wrap {
    display: block;
    margin: 15% 0 0;
    padding: 0 5%;
  }
  #top .aside_wrap > div {
    width: 100%;
  }
  #top .aside_wrap > div > ul {
    margin: 10% 0 0;
  }
  #top .aside_wrap > div.news_wrap > ul li:nth-of-type(n+2) { 
    margin: 10% 0 0; 
  }
  .banner_wrap {
    margin: 15% 0 0;
  }
  .banner_wrap > ul li img {
    width: 100%;
  }
  #top .aside_wrap > div.banner_wrap > ul li:nth-of-type(n+2) {
    margin: 2% 0 0;
  }
  #top .contact_wrap {
    margin: 10% 0 0;
    padding: 0 5%;
  }
  #top .contact_wrap dt {
    font-size: 3vw;
    font-weight: bold;
    text-align: center;
  }
  #top .contact_wrap dd {
    margin: 5% 0 0;
  }

  /* -----------------------------------------------------------
      実績・資料
  ----------------------------------------------------------- */
  .contents .main_wrap {
    padding: 0 5%;
  }
  .contents .main_wrap > section:not(:last-of-type) {
    margin: 5% 0 0;
  }
  .contents .main_wrap > section:not(:last-of-type) ul {
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
  }
  .contents .main_wrap > section:not(:last-of-type) ul li {
    flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    width: calc(100% / 2 - 1.25%);
  }
  .contents .main_wrap > section:not(:last-of-type) ul li:nth-of-type(n+2) {
    margin: 0 0 0 0;
  }
  .contents .main_wrap > section:not(:last-of-type) ul li:nth-of-type(n+3) {
    margin-top: 2.5%;
  }
  .contents .main_wrap > section:not(:last-of-type) ul li:nth-of-type(2n) {
    margin-left: 2.5%;
  }
  .contents .main_wrap > section:not(:last-of-type) ul li img {
    width: 100%;
  }

  .contents .main_wrap > section:last-of-type {
    margin: 10% 0 0;
  }
  .contents .main_wrap > section:last-of-type > article {
    margin: 2.5% 0 0;
  }
  .contents .main_wrap > section:last-of-type > article:nth-of-type(n+2) {
    margin: 10% 0 0;
  }
  .contents .main_wrap > section:last-of-type > article a {
    flex-direction: column-reverse;
    -webkit-flex-direction: column-reverse;
  }
  .contents .main_wrap > section:last-of-type > article div {
    flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    margin: 2.5% 0 0 0;
  }
  .contents .main_wrap > section:last-of-type > article div h3 {
    font-size: 22px;
    font-size: 2.2rem;
    font-weight: bold;
  }
  .contents .main_wrap > section:last-of-type > article div p {
    margin: 1% 0 0;
    line-height: 150%;
    letter-spacing: 1px;
  }
  .contents .main_wrap > section:last-of-type > article picture {
    flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    width: 100%;
  }
  .contents .main_wrap > section:last-of-type > article picture img {
    width: 100%;
  }
  /* -----------------------------------------------------------
      会社情報
  ----------------------------------------------------------- */
  .company .main_wrap {
    padding: 0 5%;
  }
}

@media screen and (max-width: 768px){
  /* -----------------------------------------------------------
      inner
  ----------------------------------------------------------- */
  .inner {
    max-width: 100%;
    min-width: 0;
    width: 100%;
  }
  .inner02 {
    max-width: 860px;
    min-width: 0;
    width: 100%;
    margin-right: auto;
    margin-left: auto;
  }


  #top .contact_wrap dd ul {
    display: block;
  }
  #top .contact_wrap dd ul li {
    text-align: center;
  }
  #top .contact_wrap dd ul li:nth-of-type(n+2) {
    margin: 5% 0 0 0;
  }
  footer {
    margin: 10% 0 0;
    padding: 10% 0% 5%;
  }
  footer > ul {
    margin: 0;
    text-align: left;
    font-size: 3.5vw;
    display: block;
  }
  footer > ul li {
    border-top: 2px solid #e4e4e4;
    padding: 15px 25px;
  }  
  footer > ul li:nth-of-type(n+2)::before {
    content: none;
    display: none;
  }
  .foot_toggle {
    position: relative;
    border-top: 2px solid #e4e4e4;
    padding: 15px 25px;
  }
  .foot_toggle:after {
    content: "＞";
    position: absolute;
    top: 50%;
    right: 5%;
    transform: rotate(90deg) translateY(-50%);
    -webkit-transform: rotate(90deg) translateY(-50%);
    -moz-transform: rotate(90deg) translateY(-50%);
    -ms-transform: rotate(90deg) translateY(-50%);
    -o-transform: rotate(90deg) translateY(-50%);
    line-height: 0;
    transition: all .5s ease;
    -webkit-transition: all .5s ease;
  }
  .foot_toggle.active:after {
    transform: rotate(270deg) translateY(-50%);
    -webkit-transform: rotate(270deg) translateY(-50%);
    -moz-transform: rotate(270deg) translateY(-50%);
    -ms-transform: rotate(270deg) translateY(-50%);
    -o-transform: rotate(270deg) translateY(-50%);
  }
  footer > ul li:last-of-type {
    border-bottom: 2px solid #dadada;
  }
  footer > ul li a {
    font-size: 3.5vw;
    color: #4d4d4d;
    font-weight: bold;
  }
  .foot_nav_wrap > ul {
    display: block;
    margin: 0;
  }
  .foot_nav_wrap > ul:nth-of-type(n+2) {
    margin: 0;
  }
  .foot_nav_wrap > ul li {
      width: 100%;
  }
  .foot_nav_contents dd ul > li:nth-of-type(n+2) {
    margin: 0 0 0;
  }
  footer > ul li a:after {
    content: "";
    width: 15px;
    height: 15px;
    background: url("../img/common/foot_nav_icon.png") no-repeat center / contain;
    margin: 0 0 0 10px;
    display: inline-block;
  }
  .foot_nav_wrap > ul > li:nth-of-type(n+2) {
    margin: 0 0 0 0;
  }
  .foot_toggle {
    cursor: pointer;
  }   
  .foot_sp_nav {
    display: block;
  }
  .foot_sp_nav li a {
    display: block;
    border-top: 2px solid #e4e4e4;
    padding: 10px 25px;
    background: #f5f5f5;
    position: relative;
  }
  .foot_sp_nav li a:after {
    content: "＞";
    position: absolute;
    right: 5%;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    font-weight: bold;
  }
  .foot_pc_nav {
    display: none;
  }

  /* -----------------------------------------------------------
                            共通（フッター）
  ----------------------------------------------------------- */
  footer .foot {
    display: block;
  }
  .foot_nav_wrap {
    margin: 10% 0 0 0;
  }
  .foot-logo_wrap figure {
    width: 70%;
    margin: 0 auto;
  }
  .foot-logo_wrap ul li a {
    width: 45px;
    height: 45px;
    font-size: 4vw;
  }
  .foot_nav_contents dt {
    font-size: 4vw;
  }
  .foot_nav_contents dd {
    margin: 0 0 0;
    font-size: 4vw;
  }
  footer .copyright {
    margin: 5% 0 0;
    font-size: 3.5vw;
  }

  /* -----------------------------------------------------------
  タグボックス
  ----------------------------------------------------------- */
  .recruit {
    padding: 0 8px 0;
  }
  .main-img-recruit {
    margin: 0 -16px 40px;
  }
  .ceo-messeage::after {
    content: "";
    display: block;
    clear: both;
  }
  .ceo-messeage img {
    float: none;
    display: block;
    width: 80%;
    margin: 0 auto 16px;
  }
  .recruit-link li, .recruit-link li:first-of-type {
    width: 100%;
    height: 104px;
    margin: 0 0 25px;
    background-size: cover;
  }
  .recruit-bnr::after {
    content: "";
    display: block;
    clear: both;
  }
  .what-somewrite li, .what-somewrite li:nth-of-type(2n-1) {
    width: 100%;
    margin: 0 0 16px;
    background-size: cover;
    background-position: 50% 0;
  }
  /* -----------------------------------------------------------
  タグボックス
  ----------------------------------------------------------- */
  .tag_box {
    display: block;
    margin: 10% 5% 0;
    padding: 5% 0;
    border-top: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
  }
  .tag_box dt {
    font-size: 3.8vw;
    letter-spacing: 0.1em;
  }
  .tag_box dt br {
    display: none;
  }
  .tag_box dd {
    margin: 5% 0 0 0;
  }
  .tag_box dd ul {
    display: flex;
    display: -webkit-flex;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
  }
  .tag_box dd ul li {
    flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    margin: 5px;
  }
  .tag_box dd ul li a {
    font-size: 12px;
    font-size: 1.2rem;
    text-decoration: underline;
    padding: 6px 11px;
    font-weight: bold;
  }
  .tag_box dd ul li a:hover {
    text-decoration: none;
  }

  .single_nav {
    margin: 15% 0 0;
    font-size: 12px;
    font-size: 1.2rem;
    font-weight: bold;
  }
  .single_nav.message {
    margin: 10% 0 0;
  }

  /* -----------------------------------------------------------
                        下層ページ　タイトル
  ----------------------------------------------------------- */
  .lower_title {
    text-align: center;
    font-size: 38px;
    font-size: 3.8rem;
    font-weight: bold;
    margin: 5% 0;
  }
  .lower_title > span {
    display: inline-block;
    padding: 20px 40px;
    position: relative;
    min-width: 600px;
    letter-spacing: 0.2em;
  }
  .lower_title > span:before,
  .lower_title > span:after {
    content: "";
    position: absolute;
    width: 40px;
    height: 36px;
    background-size: contain;
    background-position: center;
  }
  .lower_title > span:before {
    background-image: url(../img/common/lower_title_before.png);
    top: 0;
    left: 0;
  }
  .lower_title > span:after {
    background-image: url(../img/common/lower_title_after.png);
    bottom: 0;
    right: 0;
  }
  .sub_title {
    text-align: center;
    font-size: 25px;
    font-size: 2.5rem;
  }
  
  /* -----------------------------------------------------------
      toggle-panel
  ----------------------------------------------------------- */
  #panel-btn {
    flex: 0 1 35px;
    -webkit-flex: 0 1 35px;
  }
  #panel-btn-icon {
    width: 28px;
    height: 3px;
  }
  #panel-btn-icon:before,
  #panel-btn-icon:after {
    width: 28px;
    height: 3px;
  }
  header {
    height: 60px;
    min-height: 60px;
  }
  .search {
    display: block;
    flex: 0 1 25px;
    -webkit-flex: 0 1 25px;
  }
  header .inner figure {
    flex: 1 1;
    -webkit-flex: 1 1;
    margin: 0 -2% 1% 4%;
    text-align: center;
  }
  header .inner figure a {
    width: 70%;
    display: block;
    margin: 0 auto;
  }
  main {
    margin: 60px 0 0;
  }
  #g_nav ul {
    top: 60px;
}

  /* -----------------------------------------------------------
                        下層ページ　タイトル
  ----------------------------------------------------------- */
  .lower_title {
    font-size: 6vw;
    margin: 10% 0;
  }
  .lower_title > span {
    padding: 2vw;
    min-width: 0;
    width: 100%;
    letter-spacing: 0.1rem;
  }
  .lower_title > span:before,
  .lower_title > span:after {
    width: 30px;
    height: 27px;
  }
  .lower_title > span:before {
    background-image: url(../img/common/lower_title_before.png);
    top: 0;
    left: 0;
  }
  .lower_title > span:after {
    background-image: url(../img/common/lower_title_after.png);
    bottom: 0;
    right: 0;
  }
  .lower_title02 {
    font-size: 5vw;
    margin: 10% 0 0;
  }
  /* -----------------------------------------------------------
    バナー　デザイン
  ----------------------------------------------------------- */
  .gra-btn-wrapper {
    margin: 15% 0;
    padding: 0 16px 0;
    border-bottom: none;
  }
  .gra-btn-wrapper.ba-none {
    margin: 10% 0;
    padding: 0;
    border-bottom: none;
  }
  .gra-btn-wrapper > p {
    text-align: center;
    font-size: 3.5vw;
    font-weight: bold;
    margin: 0 0 2.5% 0;
  }
  .gra-btn-wrapper ul {
    display: block;
  }
  .gra-btn-wrapper ul li a,
  .gra-btn-wrapper ul li a img {
    width: 100%;
  }
  .gra-btn-wrapper.col2 ul li:nth-of-type(n+2) {
    margin: 4% 0 0 0;
  }
  .gra-btn a {
    width: 100%;
  }
  /* -----------------------------------------------------------
                            トップページ
  ----------------------------------------------------------- */
  #top .main_wrap h1 {
    font-size: 3.8vw;
  }
  #top .main_wrap > ul li a h2 {
    font-size: 3.5VW;
  }
  #top .contact_wrap dt {
    font-size: 5VW;
  }
  #top .main_wrap > ul li a {
    padding: 0;
    justify-content: flex-end;
    -webkit-justify-content: flex-start;
  }
  #top .main_wrap > ul li a h2 {
    font-size: 3vw;
    margin: 2% 0 0;
  }
  #top .main_wrap > ul li a p {
    margin: auto 0 0;
  }
  #top .main_wrap > ul li:nth-of-type(2n) a h2 {
    margin: 0 0 5% 0;
  }
  .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 5px;
  }
  /* -----------------------------------------------------------
      サムライトの事業・サービス
  ----------------------------------------------------------- */
  .business .main_wrap {
    padding: 0 5%;
  }
  .service_wrap {
    margin: 8% 0 0;
  }
  .service_wrap:nth-of-type(n+2) {
    margin: 15% 0 0;
  }
  .business .content_wrap {
    margin: 10% 0 0;
    flex-direction: column-reverse;
    -webkit-flex-direction: column-reverse;
  }
  .business .service_wrap .content_wrap:first-of-type {
    margin: 5% 0 0;
  }
  .business .content_wrap a {
    flex: 0 0 auto;
    -webkit-flex: 0 1 auto;
    width: 100%;
  }
  .business .content_wrap a img {
    width: 100%;
  }
  .business .content_wrap > div {
    margin: 2.5% 0 0 0;
  } 
  .business .content_wrap > div h3 {
    font-size: 3.8vw;
  }
  .business .content_wrap > div p {
    font-size: 3.5vw;
    margin: 2% 0 0;
  }
  
  /* -----------------------------------------------------------
      サービスを課題から探す
  ----------------------------------------------------------- */
  .issue .lower_title02::after, .news .lower_title02::after {
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 10%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
  }
  .issue h1 + div {
    margin: 5% 0 0;
    padding: 0 5%;
  }
  .tab-select-wrap {
    display: block;
  }
  .tab-select-wrap > p {
    font-size: 3.5vw;
    margin: 0 3%;
  }
  .select_contents {
    position: relative;
    margin: 2% auto 0;
    width: calc(100% - 20px);
  }
  .select_contents:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8px 8px 0px 8px;
    border-color: #000000 transparent transparent transparent;
    margin: 0 0 0 10px;
    position: absolute;
    top: 50%;
    right: 3.5%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
  }
  .tab-select-wrap select {
    width: 100%;
    border: 1px solid #bbb;
    background: linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%);
    -webkit-background: linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%);
    -moz-background: linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%);
    appearance: none;
    -webkit-appearance: none;
    padding: .6em 1.9em .5em .8em;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
    font-size: 16px;
    font-size: 1.6rem;
    box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
  }
  .tab-nav {
    display: none;
  }
  .tab-block {
    margin: 10% 0 0;
    padding: 5%;
  }
  .tab-body > div {
    padding: 5%;
  }
  .tab-body > div.is-active {
    display: block;
    animation-duration: .8s;
  }
  .tab_contents_nav li {
    padding-bottom: 5%;
    border-bottom: 1px solid #dcdcdc;
    display: flex;
    display: -webkit-flex;
    align-items: center;
    -webkit-align-items: center;
    font-size: 12px;
    font-size: 1.2rem;
    font-weight: bold;
    position: relative;
  }
  .tab_contents_nav li a {
    position: relative;
    padding: 0 5.5vw 0 0;
    width: 100%;
    font-size: 1.4rem;
  }
  .faq .tab_contents_nav li a::after {
    content: "＞";
    font-weight: bold;
    position: absolute;
    right: 0px;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    font-size: 4vw;
  }
  .tab_contents_nav li:nth-of-type(n+2) {
    margin: 5% 0 0;
  }
  .lower_btn {
    margin: 10% 0 5% 0;
  }
  .lower_btn a {
    padding: 5%;
    font-size: 3.4vw;
    display: flex;
    display: -webkit-flex;
    justify-content: center;
    -webkit-justify-content: center;
  }
  .issue .lower_btn a::after, .news .lower_btn a::after, .faq .lower_btn a::after {
    margin: 0 0 0 20px;
  }
  .issue .ico_nav,
  .news .ico_nav {
    padding: 0 5%;
  }
  .issue .gra-btn-wrapper,
  .news .gra-btn-wrapper {
    padding: 0 5%;
  }
    /* -----------------------------------------------------------
      lv3 共通スタイル
  ----------------------------------------------------------- */
  .main_img_lv3 {
    padding: 0 5%;
  }
  .lower_title02.lv3_title::after {
    bottom: 10px;
  }
  .lv3_wrap {
    margin: 20px 0 0;
    padding: 0 5%;
  }
  .lv3_wrap > h2 {
    font-size: 4.5vw;
  }
  .lv3_wrap > p {
    font-size: 16px;
    font-size: 1.6rem;
    max-width: 800px;
    width: 100%;
    margin: 5% auto 0;
  }
  .lv3_contents {
    margin: 15% 0 0;
    display: block;
  }
  .lv3_contents article {
    width: 100%;
  }
  .lv3_contents article:nth-of-type(2n) {
    margin-left: 0;
  }
  .lv3_contents article:nth-of-type(n+2) {
    margin-top: 10%;
  }
  .lv3_title_box h3 {
    font-size: 4vw;
    padding: 0 0 0 25vw;
    text-align: left;
  }
  .lv3_title_box img {
    width: 100%;
  }
  .lv3_foot_banner {
    display: block;
    padding: 0 5%;
  }
  .lv3_foot_banner .ico_nav {
    flex: 1;
    -webkit-flex: 1;
  }
  .lv3_foot_banner .cm_banner {
    margin: 15% 0 0;
    display: block;
  }
  .lv3_foot_banner .cm_banner li {
    margin: 0 0 0 0;
  }
  .lv3_foot_banner .cm_banner li:nth-of-type(n+2) {
    margin: 5% 0 0 0;
  }

  /* -----------------------------------------------------------
      lv4 共通スタイル
  ----------------------------------------------------------- */
  .lv4 .main_wrap {
    padding: 0 5%;
  }
  .lower_title02 { 
    padding-bottom: 10px;
  }
  .lv4 .main_wrap > section {
    margin: 15% 0 0;
  }
  .lv4_mainimg {
    margin: 2.5% 0 0;
  }
  .lv4_subtitle {
    font-size: 5vw;
    text-align: center;
    margin: 0 0 5% 0;
    padding: 0 0 10px 0;
  }
  .lv4_faq_contents {
    font-size: 4vw;
    padding: 5% 11%;
  }
  .lv4_faq_contents:nth-of-type(n+2) {
    margin: 3% 0 0;
  }
  .lv4_faq_contents:before, 
  .lv4_faq_contents:after {
    font-size: 10vw;
  }
  .lv4_merit_contents:nth-of-type(n+2) {
    margin: 10% 0 0;
  }
  .lv4_merit_contents dt {
    font-size: 4.5vw;
    padding: 2.5%;
  }
  .lv4_merit_contents dd {
    margin: 3% 0 0;
  }

  .lv4_contents_of_offer_contents:nth-of-type(n+2) {
    margin: 10% 0 0;
  }
  .lv4_contents_of_offer_contents > dt {
    font-size: 5vw;
  }
  .lv4_contents_of_offer_contents > dd {
    margin: 5% 0 0;
  }
  .lv4_contents_of_offer_contents > dd > ul li:nth-of-type(n+2){
    margin: 5% 0 0;
  }
  .lv4_sub_contents dt {
    font-size: 4vw;
  }
  .lv4_sub_contents dt:before {
    content: "■";
    color: #ff1111;
  }
  .lv4_sub_contents dd {
    margin: .5% 0 0;
    font-size: 14px;
    font-size: 1.4rem;
  }
  .lv4_sub_contents dd > p:first-of-type {
    font-size: 6vw;
  }
  .lv4_use_case_contents:nth-of-type(n+2) {
    margin: 8% 0 0;
  }
  .lv4_use_case_contents > dt {
    font-size: 4vw;
  }
  .lv4_use_case_contents > dd {
    margin: .5% 0 0;
  }
  .lv4_use_case_contents > dd > dl dt a {
    font-size: 5.4vw;
  }
  .lv4_use_case_contents > dd > dl dd {
    margin: .5% 0 0;
    font-size: 16px;
    font-size: 1.6rem;
  }

  .lv4_contents_flow > dl:nth-of-type(n+2) {
    margin: 8% 0 0;
  }
  .lv4_contents_flow > dl dt {
    font-size: 4.5vw;
    font-weight: bolder;
    color: #ff1111;
  }
  .lv4_contents_flow > dl dd {
    font-size: 3.5vw;
    margin: 2.5% 0 0;
  }

  .lv4_contents_suppliers > div figure {
    width: calc(100% / 2);
    padding: 0 5%;
  }
  .lv4_contents_suppliers > div figure:nth-of-type(n+3) {
    margin: 5% 0 0;
  }

  .lv4_contents_question dl:nth-of-type(n+2) {
    margin: 8% 0 0;
  }
  .lv4_contents_question dl dt {
    font-size: 4.5vw;
  }
  .lv4_contents_question dl dt:before {
    font-size: 7vw;
  }
  .lv4_contents_question dl dd {
    font-size: 3.5vw;
    margin: 4% 0 0;
  }
  .lv4_contents_question > p {
    text-align: right;
    margin: 8% 0 0;
  }

  .lv4_link a {
    text-decoration: underline;
  }
  .lv4_link a:hover {
    text-decoration: none;
  }
  
  /* -----------------------------------------------------------
      ニュース
  ----------------------------------------------------------- */
  .news .lower_title {
    padding: 0 5%;
  }
  .news_single .main_wrap {
    margin: 2% auto 0;
    padding: 0 5%;
  }
  .news_single_contents h2, .news_single_contents h3, .news_single_contents h4 {
    margin: 24px 0 16px;
  }
  .news_single_contents h2 {
    font-size: 2rem;
  }
  .news_single_contents h3 {
    font-size: 1.8rem;
  }
  .news_single_contents h4 {
    font-size: 1.6rem;
  }
  .news_single_contents p {
    line-height: 200%;
  }
  .text-box {
    padding: 24px 13px;
  }
  .list-box, .list-box-orange {
    padding: 16px 13px;
  }
  .news .tab_contents_nav li {
    padding-bottom: 25px;
    border-bottom: 1px solid #dcdcdc;
    display: block;
    font-size: 16px;
    font-size: 1.6rem;
    font-weight: bold;
  }
  .tab_contents_nav li:nth-of-type(n+2) {
    margin: 15px 0 0;
  }
  .news .cat {
    display: inline-block;
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: bold;
    text-align: center;
    padding: 1px 25px;
    border: 2px solid #000;
  }
  .news .tab_contents_nav li p {
    margin: 10px 0 0;
    display: block;
    position: relative;
    padding: 0 6vw 0 0;
  }
  .news .tab_contents_nav li p::after {
    content: "＞";
    font-weight: bold;
    position: absolute;
    right: 0px;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    font-size: 4vw;
  }
  .news .tab_contents_nav li p time {
    flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
  }
  .news .tab_contents_nav li p a {
    margin: 0 0 0 10px;
    text-decoration: underline;
    position: relative;
    padding: 0 0 0 0;
  }
  .news .tab_contents_nav li p a:hover {
    text-decoration: none;
  }
  .page-numbers {
    margin: 5% 0 0;
  }
  /* -----------------------------------------------------------
    ニュース（single）
  ----------------------------------------------------------- */
  .news_title_box h1 {
    font-size: 2.3rem;
  }
  /* -----------------------------------------------------------
      実績・資料
  ----------------------------------------------------------- */
  .contents .main_wrap > section:not(:last-of-type) {
    margin: 15% 0 0;
  }
  .contents .main_wrap > section:not(:last-of-type) ul {
    display: block;
    margin: 5% 0 0;
  }
  .contents .main_wrap > section:not(:last-of-type) ul li {
    width: 100%;
  }
  .contents .main_wrap > section:not(:last-of-type) ul li:nth-of-type(2n) {
    margin-left: 0;
  }
  .contents .main_wrap > section:not(:last-of-type) ul li:nth-of-type(n+2) {
    margin-top: 10%;
  }
  .contents .main_wrap > section:not(:last-of-type) ul li a p {
    font-size: 4vw;
  }
  .contents .main_wrap > section:not(:last-of-type) > p {
    font-size: 14px;
    font-size: 1.4rem;
    margin: 5% 0 0;
    text-align: right;
  }
  .contents .main_wrap > section:last-of-type {
    margin: 15% 0 0;
  }

  .contents .main_wrap > section:last-of-type > article {
    margin: 5% 0 0;
  }
  .contents .main_wrap > section:last-of-type > article div h3 {
    font-size: 4vw;
    padding: 0 0 5px;
    line-height: 150%;
    letter-spacing:1px;
  }
  .tag ul li {
      margin: 0 8px 0 0!important;
      display: inline-block;
  }
  /* -----------------------------------------------------------
      ダウンロード詳細
  ----------------------------------------------------------- */
  .google_slide {
    padding-top: 64%;
  }
  .kairos_form {
    margin: 5% 0 0;
  }
  .download_single .main_wrap > p {
    font-size: 1.4rem;
    margin: 10% 0 0;
  }  
  .relation_box {
    margin-top: 10%;
  }
  .relation_box dt {
    font-size: 4vw;
  }
  .relation_box dd {
    margin: 2% 0 0;
  }
  .relation_box dd ul {
    display: block;
  }
  .relation_box dd ul li {
    flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    width: 100%;
  }
  .relation_box dd ul li:nth-of-type(n+2) {
    margin: 5% 0 0 0;
  }
  .relation_box dd ul li p {
    font-weight: bold;
    margin: 5px 0 0;
  }
  .relation_box dd ul li img {
    width: 100%;
  }
  /* -----------------------------------------------------------
      実績・事例一覧
  ----------------------------------------------------------- */
  .performance_title_box {
    align-items: flex-start;
    -webkit-align-items: flex-start;
    flex-direction: column-reverse;
    -webkit-flex-direction: column-reverse;
  }
  .performance_title_box h1 {
    flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    margin: 5% 0 0 0;
    font-size: 4.8vw;
  }
  .performance .main_wrap {
    padding: 0 5%;
  }
  .performance .main_wrap .performance_contents ul {
    display: block;
    margin: 5% 0 0;
  }
  .performance .main_wrap .performance_contents ul li {
    flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    width: 100%;
    margin-left: 0;
  }
  .performance .main_wrap .performance_contents ul li:nth-of-type(3n+1) {
    margin-left: 0;
  }
  .performance .main_wrap .performance_contents ul li:nth-of-type(n+2) {
    margin-top: 10%;
  }
  .performance .main_wrap .performance_contents ul li a {
    display: block;
  }
  .performance .main_wrap .performance_contents ul li a img {
    width: 100%;
  }
  .performance .main_wrap .performance_contents ul li a p {
    font-size: 3.5vw;
  }
  .performance .lower_btn {
    text-align: center;
    margin: 5% 0 0;
  }
  .performance .lower_btn a:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8px 8px 0px 8px;
    border-color: #000000 transparent transparent transparent;
    margin: 0 0 0 10px;
  }

  .performmance_single_contents {
    margin: 15% 0 0;
  }
  .performmance_single_contents p {
    margin: 10% 0 0;
    font-size: 16px;
    font-size: 1.6rem;
  }
  .sub_title {
    padding: 0 0 10px 0;
  }
  .performance_client_information {
    margin: calc(10% + 10px) 0 0;
    padding: 24px;
  }
  .performance_client_information dl:nth-of-type(n+2) {
    margin: 10% 0 0; 
  }
  .performmance_single_contents p {
    margin: 10% 0 0;
  }
  .performance_title_box picture {
    flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    width: 100%;
    text-align: center;
  }
  /* -----------------------------------------------------------
      会社情報
  ----------------------------------------------------------- */
  .company_nav {
    margin: 10% 0 0;
    display: block;
  }
  .company_nav div:nth-of-type(-n+2) {
    flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    width: 100%;
  }
  .company_nav div:nth-of-type(2) {
    margin-left: 0;
  }
  .company_nav div:nth-of-type(n+3) {
    margin-top: 0;
    flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    width: 100%;
  }
  .company_nav div:nth-of-type(n+2) {
    margin-top: 5%;
  }
  .company_nav div:nth-of-type(n+4) {
    margin-left: 0;
  }
  .company_nav div img {
    width: 100%;
  }
  /* -----------------------------------------------------------
      ミッション・バリュー・クレド
  ----------------------------------------------------------- */
  .mvc .main_wrap {
    padding: 0 5%;
  }
  .mvc_sub_title span {
    font-size: 8vw;
  }
  .mvc_contents {
    padding: 0 0 8% 0;
  }
  .mvc_contents section {
    margin: 15% 0 0;
  }
  .mission-vision > p:not(:last-of-type) {
    font-size: 9vw;
  }
  .mission-vision > p:last-of-type {
    font-size: 4vw;
  }
  .value p {
    font-size: 7vw;
    margin: 8% 0 0;
  }
  .value p:before {
    font-size: 4vw;
  }
  .credo dl {
    max-width: 600px;
    width: 100%;
    margin: 10% auto 0;
    font-weight: bold;
    text-align: left;
  }
  .credo dl dt {
    font-size: 6vw;
  }
  .credo dl dd {
    font-size: 5vw;
  }

  /* -----------------------------------------------------------
      メッセージ
  ----------------------------------------------------------- */
  .message .main_wrap {
    padding: 0 5%;
  }
  .message_contents {
    margin: 5% 0 0;
  }
  .message_contents > div:nth-of-type(n+2) {
    margin: 10% 0 0;
  }
  .message_description {
    flex-direction: column-reverse;
    -webkit-flex-direction: column-reverse;
  }
  .message_description:nth-of-type(2n) {
    flex-direction: column-reverse;
    -webkit-flex-direction: column-reverse;
  }
  .message_description picture {
    flex: 0 1 auto;
    -webkit-flex: 0 1 auto;
    margin: 0 auto;
    width: 100%;
  }
  .message_description picture img {
    width: 100%;
  }
  .message_description div {
    flex: 1;
    -webkit-flex: 1;
    font-weight: normal;
    line-height: 1.5;
    margin: 5% 0 0 0;
    font-size: 14px;
    font-size: 1.4rem;
  }
  .message_description:nth-of-type(2n) div {
    flex: 1;
    -webkit-flex: 1;
    font-weight: normal;
    line-height: 1.5;
    letter-spacing:  0.01em;
    margin: 5% 0 0 0;
  }
  .message_description div p.name {
    margin: 8% 0 0;
  }
  /* -----------------------------------------------------------
      会社概要
  ----------------------------------------------------------- */
  .outline .main_wrap {
    padding: 0 5%;
  }
  .outline_contents {
    margin: 5% 0 0;
  }
  .outline_description {
    margin: 5% 0 0;
  }
  .outline_description dl {
    display: block;
    font-size: 3.5vw;
    padding: 0 0 5% 0;
    margin: 0 0 5% 0;
  }
  .outline_description dl dt {
    font-weight: bold;
  }
  .outline_description dl dd {
    margin: 4% 0 0;
  }

  /* -----------------------------------------------------------
      サムライトの歴史
  ----------------------------------------------------------- */
  .history .main_wrap {
    padding: 0 5%;
  }
  .history_contents {
    margin: 5% 0 0;
  }
  .history_contents table {
    table-layout: fixed;
    border-collapse: collapse;
    width: 100%;
  }
  .history_contents table tr {
    border: 1px solid #dcdcdc;
    vertical-align: middle;
  }
  .history_contents table tr th {
    padding: 10px 20px;
    font-size: 4vw;
    width: 100%;
    letter-spacing: -0.3px;
  }
  .history_contents table tr th,
  .history_contents table tr td {
    display: block;
  }
  .history_contents table tr td {
    font-size: 3.5vw;
  }
  .history_contents table tr td ul li:nth-of-type(n+2) {
    margin: 10px 0 0;
  }
  /* -----------------------------------------------------------
    オフィス紹介
  ----------------------------------------------------------- */
  .office .main_wrap {
    padding: 0 5%;
  }
  .office_contents {
    margin: 5% 0 0;
  }
  .office_contents > figure:nth-of-type(n+2) {
    margin: 5% 0 0;
  }
  .office_contents figure figcaption {
    font-size: 3.5vw;
    margin: 3% 0 0;
  }
  .office_contents .office_flex {
    display: block;
    margin: 5% 0 0;
  }
  .office_contents .office_flex figure:nth-of-type(n+2) {
    margin: 5% 0 0 0;
  }

  /* -----------------------------------------------------------
    よくある質問
  ----------------------------------------------------------- */
  .faq .ico_nav {
    padding: 0 5%;
  }
  .faq .gra-btn-wrapper {
    padding: 0 5%;
  }
  .faq .lower_title02::after {
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 10%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
  }
  .faq .lower_title02 {
    padding-left: 5%;
    padding-right: 5%;
  }
  .tag_nav_wrap {
    margin: 0 0 0;
    padding: 10% 10%;
    display: block;
  }
  .tag_nav_wrap li:nth-of-type(2n) {
    margin-left: 0;
  }
  .tag_nav_wrap li:nth-of-type(n+2) {
    margin-top: 5%;
  }
  .tag_nav_wrap li a {
    width: 100%;
    font-size: 14px;
    font-size: 1.4rem;
  }

  /* -----------------------------------------------------------
      新卒採用
  ----------------------------------------------------------- */
  .recruit_mainvisual {
    background-size: cover;
    background-position: center;
    min-height: 340px;
    padding: 16px;
    margin: 0 0 40px;
  }
  .recruit_single_contents th, .recruit_single_contents td {
    display: block;
    width: 100%;
  }
  .recruit_lv3_contents::after {
    content: "";
    display: block;
    clear: both;
  }
  .recruit_lv3_contents {
    padding: 0 16px;
    margin: 0 auto 54px;
  }
  .recruit_lv3_contents li:nth-of-type(2n-1) {
    margin-right: 16px;
  }
  .recruit_lv3_contents li {
    width: 100%;
    margin: 0 0 16px;
    margin-right: 0px;
    height: 80px;
  }
  .recruit_lv3_faq {
    padding: 0 16px;
  }
  .recruit_lv3_faq dl dt p {
    width: 90%;
  }
  .ricruit_lv3 h2 {
    text-align: center;
    font-size: 1.8rem;
    padding: 0 0 8px;
  }
  .recruit-menu {
    padding: 0 16px;
  }
  .recruit_mainvisual strong {
    text-align: center;
    display: block;
    font-size: 5vw;
    line-height: 150%;
    letter-spacing: 8px;
    margin: 0 0 16px;
  }
  .recruit_mainvisual p {
    text-align: center;
    font-size: 4vw;
    line-height: 180%;
  }
  .member-btn {
    width: 90%;
  }
  /* -----------------------------------------------------------
      中途採用
  ----------------------------------------------------------- */
  .welfare {
    width: 95%;
  }
  .welfare_wrap > p {
    font-size: 1.3rem;
  }
  .welfare-bnr {
    width: 100%;
    padding: 0 8px;
  }
  .welfare_detail {
    width: 100%;
    height: auto;
    padding: 24px;
  }

  /* -----------------------------------------------------------
      SNSポリシー
  ----------------------------------------------------------- */
  .sns-policy .main_wrap {
    padding: 0 5%;
  }
  .sns-policy .main_wrap > p {
    margin: 5% 0 0;
    font-size: 14px;
    font-size: 1.4rem;
  }
  .sns-policy_contents > section {
    margin: 8% 0 0;
    font-size: 14px;
    font-size: 1.4rem;
  }
  .sns-policy_contents > section h2 {
    font-size: 16px;
    font-size: 1.6rem;
  }
  .sns-policy_contents > section h2 + p {
    margin: 2.5% 0 0;
  }
  .sns_wrap {
    margin: 8% 0 0;
  }
  .sns_wrap > table {
    table-layout: fixed;
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #dcdcdc;
    font-size: 14px;
    font-size: 1.4rem;
  }
  .sns_wrap > table:first-of-type {
    margin: 2.5% 0 0;
  }
  .sns_wrap > table:nth-of-type(n+2) {
    margin: 4% 0 0;
  }
  .sns_wrap > table th,
  .sns_wrap > table td {
    padding: 3% 5%;
    border: 1px solid #dcdcdc;
    vertical-align: middle;
    display: block;
  }
  .sns_wrap > table th {
    background: #f6f6f6;
    width: 100%;
  }
  .sns_box_title {
    font-size: 16px;
    font-size: 1.6rem;
  }

  /* -----------------------------------------------------------
      行動ターゲティング広告 ガイドライン
  ----------------------------------------------------------- */
  .guideline .main_wrap {
    padding: 0 5%;
  }
  .guideline .main_wrap > p {
    margin: 5% 0 0;
    font-size: 14px;
    font-size: 1.4rem;
  }
  .guideline_contents > section {
    margin: 10% 0 0;
    font-size: 14px;
    font-size: 1.4rem;
  }
  .guideline_contents > section h2 {
    font-size: 16px;
    font-size: 1.6rem;
  }
  .guideline_contents > section:first-of-type ul {
    margin: 5% 0 0;
  }
  .guideline_contents > section:first-of-type ul li:nth-of-type(n+2) {
    margin: 5% 0 0;
  }
  .guideline_contents > section:first-of-type p {
    margin: 5% 0 0;
  }

  .guideline_contents > section:nth-of-type(2) p {
    margin: 5% 0 0;
  }
  .guideline_contents > section:nth-of-type(2) ul {
    margin: 10% 0 0;
  }

  .guideline_contents > section:nth-of-type(3) dl {
    margin: 5% 0 0;
  }
  .guideline_contents > section:nth-of-type(3) dl:nth-of-type(n+2) {
    margin: 5% 0 0;
  }
  .guideline_contents > section:nth-of-type(3) dl dd {
    margin: 2.5% 0 0;
  }
  .guideline_contents > section:nth-of-type(3) dl dd p:nth-of-type(n+2) {
    margin: 2% 0 0;
  }
  .guideline_contents > section:nth-of-type(3) dl dd ul li {
    margin: 2% 0 0;
  }
  /* -----------------------------------------------------------
      プライバシーポリシー
  ----------------------------------------------------------- */
  .privacy .main_wrap {
    padding: 0 5%;
  }
  .privacy .main_wrap > p {
    margin: 5% 0 0;
    font-size: 14px;
    font-size: 1.4rem;
  }
  .privacy_contents > ol > li {
    margin: 10% 0 0;
  }
  .privacy_contents > ol > li dl dt {
    font-size: 16px;
    font-size: 1.6rem;
  }
  .privacy_contents > ol > li dl dd {
    font-size: 14px;
    font-size: 1.4rem;
    margin: 5% 0 0;
  }
  .privacy_contents_list {
    margin: 5% 0 0;
  }

}