@charset "UTF-8";


/* **********************************
 *  共通
 * ********************************* */

/* ページ内ナビ */
.pg_category_nav{
}
.pg_category_nav ul{
  display: flex;
  flex-wrap: wrap;
  margin: 0 -5px;
}
.pg_category_nav ul li{
  width: 100%;
  padding: 0 5px;
}
/*.pg_category_nav ul li:nth-child(n+2){
  margin-top: 10px;
}
.pg_category_nav ul li a{
  display: block;
  background: #FFF;
  border: 2px solid #261a5d;
  border-radius: 26px;
  font-size: 14.39px;
  font-weight: 500;
  text-align: center;
  text-decoration: none;
  letter-spacing: 0.075em;
  position: relative;
  padding: 10px 10px;
  transition: 0.2s all;
}
.pg_category_nav ul li a:after{
  content: "\f13a";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  position: absolute;
  top: 50%;
  right: 20px;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  transition: 0.2s all;
}
.pg_category_nav ul li:hover a,
.pg_category_nav ul li.on a{
  background: #261a5d;
  color: #FFF;
  opacity: 1;
}*/

.pg_category_nav ul li:hover a:after{
  /*right: 10px;*/
}

.pg_category_nav.noArr ul li a:after{
  display: none;
}
.pg_category_nav.fw500 ul li a{
  font-weight: 500;
  color: #261a5d;
}
.pg_category_nav.fw500 ul li a:hover{
  color: #FFF;
}

@media (max-width:374px){

}
@media (min-width:375px){

}
@media (max-width:767px){

}
@media (min-width:768px){



  /* ページ内ナビ */
  .pg_category_nav{
  }
  .pg_category_nav ul{
    margin: 0 -10px;
  }
  .pg_category_nav ul li{
    padding: 0 10px;
  }
  .pg_category_nav ul li:nth-child(n+2){
    margin-top: 0;
  }
  .pg_category_nav ul li a{
    font-size: 15px;
  }
  .pg_category_nav ul li a:after{
    right: 5px;
  }

  .pg_category_nav ul.col2 li{
    width: 50%;
  }
  .pg_category_nav ul.col2 li:nth-child(n+3){
    margin-top: 25px;
  }
  .pg_category_nav ul.col3 li{
    width: 33.333%;
  }
  .pg_category_nav ul.col3 li:nth-child(n+4){
    margin-top: 25px;
  }
  .pg_category_nav ul.col4 li{
    width: 25%;
  }
  .pg_category_nav ul.col4 li:nth-child(n+5){
    margin-top: 25px;
  }

}
@media (min-width:1024px){

  /* ページ内ナビ */
  .pg_category_nav{
  }
  .pg_category_nav ul{
    margin: 0 -15px;
  }
  .pg_category_nav ul li{
    padding: 0 15px;
  }

  .pg_category_nav ul li a{
    /*font-size: 15px;*/
  }
  .pg_category_nav ul li a:after{
    right: 18px;
  }


}
@media (min-width:1200px){

  /* ページ内ナビ */
  .pg_category_nav{
  }


}


/* **********************************
 *  
 * ********************************* */
.pg_xxxx{

}
.pg_xxxx .section.sec1{

}
.pg_xxxx .section.sec2{

}
.pg_xxxx .section.sec3{

}


@media (max-width:374px){

}
@media (min-width:375px){

}
@media (max-width:767px){

}
@media (min-width:768px){


}
@media (min-width:1024px){


}
@media (min-width:1200px){


}

/* **********************************
 *  OEM
 * ********************************* */
.pg_oem{

}
.pg_oem .section.sec0{

}
.pg_oem .section.sec1{
  position: relative;
  padding-bottom: 50px;
}
.pg_oem .section.sec1:after{
  content: "";
  background: #f1f5f8;
  position: absolute;
  z-index: -1;
  top: 200px;
  bottom: 0;
  left: 0;
  right: 0;
}
.pg_oem .section.sec2{

}
.pg_oem .section.sec3{
  background: #f1f5f8;
  padding-top: 50px;
  margin-top: 50px;
  padding-bottom: 0;
}
.pg_oem .section.sec4{

}

/* 概要 */
.oem_about_wrap{

}
.oem_about_wrap .img{

}
.oem_about_wrap .img.img_fit:before{
  padding-top: 36.03%;
}
.oem_about_wrap .txt{
  font-size: 16px;
  letter-spacing: 0.075em;
  line-height: 1.875;
  text-align: justify;
  margin-top: 20px;
}

/* 対応可能例 */
.oem_cases1_items{
  display: flex;
  flex-wrap: wrap;
  margin: 0 -5px;
}
.oem_cases1_items .item{
  width: 50%;
  padding: 0 5px;
}
.oem_cases1_items .item:nth-child(n+3){
  margin-top: 25px;
}
.oem_cases1_items .item .title{
  display: flex;
  justify-content: center;
  align-items: center;
  background: #f1f5f8;
  font-size: 16px;
  letter-spacing: 0.075em;
  line-height: 1.62;
  text-align: center;
  padding: 3px 5px;
  min-height: 70px;
  border-right: 4px solid #261a5d;
  border-bottom: 4px solid #261a5d;
  margin-bottom: 15px;
  font-weight: 500;
}
.oem_cases1_items .item .img{

}
.oem_cases1_items .item .img.img_fit:before{
  padding-top: 100%;
}
.oem_cases1_items .item .txt{
  font-size: 15px;
  letter-spacing: 0.075em;
  line-height: 1.875;
  margin-top: 15px;
}
.oem_cases1_items .item .list_colmun{
  display: flex;
  flex-wrap: wrap;
  /*justify-content: space-between;*/
}
.oem_cases1_items .item ul{

}
.oem_cases1_items .item ul li{
  text-indent: -1em;
  padding-left: 1em;
}

/* 設計・開発事例 */
.oem_cases2_items{

}
.oem_cases2_items .item{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding-top: 40px;
  padding-bottom: 40px;
  position: relative;
  z-index: 0;
}
.oem_cases2_items .item + .item{

}
.oem_cases2_items .item:first-child{
  padding-top: 0;
}

.oem_cases2_items .item .box1{
  width: 100%;
  order: 2;
}
.oem_cases2_items .item .box2{
  width: 100%;
  margin-top: 20px;
  order: 3;
  position: relative;
  /*padding-bottom: 75px;*/
}
.oem_cases2_items .item .title{
  order: 1;
  width: 100%;
  padding: 5px 0;
  border-bottom: 2px solid #d9d9d9;
  margin-bottom: 20px;
  position: relative;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.075em;
  line-height: 1.5;
}
.oem_cases2_items .item .title:after{
  content: "";
  background: #261a5d;
  width: 64px;
  height: 2px;
  position: absolute;
  left: 0;
  bottom: -2px;
}
.oem_cases2_items .item .img.img_fit:before{
  padding-top: 75%;
}
.oem_cases2_items .item .txt{
  font-size: 16px;
  letter-spacing: 0.075em;
  line-height: 1.875;
  text-align: justify;
}
.oem_cases2_items .item .list{
  letter-spacing: 0.075em;
}
.oem_cases2_items .item .txt + .list{
  margin-top: 15px;
}
.oem_cases2_items .item .list li{
  text-indent: -1.5em;
  padding-left: 1.5em;
}
.oem_cases2_items .item .list li+li{
  /*margin-top: 10px;*/
}
.oem_cases2_items .item .list li:before{
  content: "・";
  color: #6352b2;
  font-size: 1.5em;
  line-height: 1;
}
.oem_cases2_items .item .link{
  margin-top: 15px;
}
.oem_cases2_items .item .link a{
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  background: #261a5d;
  color: #FFF;
  font-size: 14.39px;
  font-weight: 500;
  letter-spacing: 0.075em;
  line-height: 1.428;
  text-decoration: none;
  text-align: center;
  border-radius: 30px;
  padding: 9px 10px 10px;
  min-height: 60px;
  position: relative;
}
.oem_cases2_items .item .link a:after{
  content: "\f0a9";

  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  position: absolute;
  top: 50%;
  right: 20px;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
}

.oem_cases2_items .item:nth-child(odd):after,
.oem_cases2_items .item:nth-child(even):after{

}
.oem_cases2_items .item:nth-child(odd):after{

}
.oem_cases2_items .item:nth-child(even):after{
  content: "";
  width: 1000%;
  height: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: -50%;
  background: #FFF;
  z-index: -1;
  /*-webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);*/
}

/* 対応の流れ */
.oem_flow_items{

}
.oem_flow_items .item{
  border: 1px solid #261a5d;
  padding-bottom: 20px;
}
.oem_flow_items .item .inner{
  padding: 0 20px;
}
.oem_flow_items .item .title{
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.075em;
  background: #261a5d;
  color: #FFF;
  text-align: center;
  padding: 5px;
  margin-bottom: 40px;
}
.oem_flow_items .item .img_box{
  position: relative;
}
.oem_flow_items .item .img{

}
.oem_flow_items .item .img.img_fit:before{
  padding-top: 52.94%;
}
.oem_flow_items .item .num{
  font-size: 60px;
  font-weight: 500;
  font-family: "Outfit";
  letter-spacing: 0.075em;
  color: #ebebeb;
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 1;
}
.oem_flow_items .item .txt{
  font-size: 16px;
  letter-spacing: 0.075em;
  line-height: 1.875;
  text-align: justify;
  margin-top: 20px;
}
.oem_flow_items .arrow{
  padding: 20px 0;
  text-align: center;
}
.oem_flow_items .arrow img{

}

.pg_oem #cmn_links{
  margin-top: 80px;
  padding: 0;
}
.oem_banner {
  padding: 35px 15px;
  margin-bottom: 60px;
  display: block;
  background: url(/img/oem/oem_bnr.jpg) no-repeat center / cover;
  border: 5px solid #261a5d;
  text-align: center;
}
.oem_banner:hover{
  opacity: 1;
}
.oem_banner .home_tt1_en{
  color: #181818;
}
.oem_banner .text{
  margin-top: 25px;
  letter-spacing: 0.1em;
}
.oem_banner .btn{
  max-width: 758px;
  font-size: 16px;
  margin: 30px auto 0;
  width: 100%;
  padding: 14px;
  font-weight: 700;
  letter-spacing: 0.13em;
  background: #261a5d;
  color: #ffffff;
  transition: 0.2s;
}
.oem_banner .btn .outfit{
  font-size: 22px;
  font-weight: 500;
}
.oem_banner:hover .btn{
  background: #523db1;
}

@media (max-width:374px){

}
@media (min-width:375px){

}
@media (max-width:767px){

  .pg_oem .section.sec1:after{

  }

  .pg_oem .section.sec2 .tt2{
    margin-bottom: 60px;
  }
}
@media (min-width:768px){

  .pg_oem .section.sec0{

  }
  .pg_oem .section.sec1{
    padding-bottom: 70px;
  }
  .pg_oem .section.sec1:after{
    top: auto;
    height: 450px;
  }
  .pg_oem .section.sec2 .tt2{
    margin-bottom: 120px;
  }
  .pg_oem .section.sec3{
    margin-top: 60px;
    padding-top: 60px;
    padding-bottom: 20px;
  }
  .pg_oem .section.sec4{

  }

  /* 概要 */
  .oem_about_wrap{

  }
  .oem_about_wrap .img{

  }
  .oem_about_wrap .txt{
    font-size: 16.44px;
    margin-top: 35px;
  }

  /* 対応可能例 */
  .oem_cases1_items{
    margin: 0 -10px;
  }
  .oem_cases1_items .item{
    width: 50%;
    padding: 0 10px;
  }
  .oem_cases1_items .item:nth-child(n+3){
    margin-top: 30px;
  }
  .oem_cases1_items .item .title{
    font-size: 18.5px;
    border-right: 4px solid #261a5d;
    border-bottom: 4px solid #261a5d;
    margin-bottom: 25px;
  }
  .oem_cases1_items .item .img{

  }
  .oem_cases1_items .item .txt{
    font-size: 16.44px;
    margin-top: 22px;
  }
  .oem_cases1_items .item .list_colmun ul{
    width: 49%;
  }

  /* 設計・開発事例 */
  .oem_cases2_items{
    margin-top: -10px;
  }
  .oem_cases2_items .item{
    padding-top: 60px;
    padding-bottom: 60px;
  }
  .oem_cases2_items .item + .item{

  }
  .oem_cases2_items .item .box1{
    /*width: 48.64%;*/
    width: 49%;
  }
  .oem_cases2_items .item .box2{
    /*width: 42.79%;*/
    width: 48%;
    margin-top: -8px;
    padding-bottom: 75px;
  }
  .oem_cases2_items .item .title{
    width: 100%;
    margin-bottom: 40px;
    font-size: 20.56px;
  }
  .oem_cases2_items .item .txt{
    font-size: 16.44px;
  }
  .oem_cases2_items .item .list{
    font-size: 16.44px;
  }
  .oem_cases2_items .item .list li{
  }
  .oem_cases2_items .item .link{
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
  }
  .oem_cases2_items .item .link a:after{
    right: 50px;
  }

  .oem_cases2_items .item:nth-child(odd) .box1{

  }
  .oem_cases2_items .item:nth-child(odd) .box2{

  }
  .oem_cases2_items .item:nth-child(even) .box1{
    order: 3;
  }
  .oem_cases2_items .item:nth-child(even) .box2{
    order: 2;
  }

  /* 対応の流れ */
  .oem_flow_items{

  }
  .oem_flow_items .item{
    padding-bottom: 25px;
  }
  .oem_flow_items .item .inner{
    padding: 0 50px;
  }
  .oem_flow_items .item .title{
    font-size: 18px;
    margin-bottom: 60px;
  }
  .oem_flow_items .item .num{
    font-size: 80px;
  }
  .oem_flow_items .item .txt{
    font-size: 16.44px;
    margin-top: 20px;
  }

  .oem_flow_items .arrow{
    padding: 30px 0;
  }
  .oem_flow_items .arrow img{
    width: auto;
  }

  .pg_oem #cmn_links{
    margin-top: 150px;
  }
  .oem_banner {
    padding: 38px;
  }
  .oem_banner .home_tt1_ja{
    margin-top: 3px;
  }
  .oem_banner .text{
    margin-top: 48px;
  }
  .oem_banner .btn{
    font-size: 23px;
    margin: 50px auto 0;
  }
  .oem_banner .btn .outfit{
    font-size: 30px;
  }
}
@media (min-width:1024px){


}
@media (min-width:1200px){

  .pg_oem .section.sec0{

  }
  .pg_oem .section.sec1{
    padding-bottom: 110px;
  }
  .pg_oem .section.sec1:after{
    height: 630px;
  }
  .pg_oem .section.sec2{

  }
  .pg_oem .section.sec3{
    margin-top: 110px;
    padding-top: 110px;
    padding-bottom: 20px;
  }
  .pg_oem .section.sec4{

  }

  /* 対応可能例 */
  .oem_cases1_items{
    margin: 0 -15px;
  }
  .oem_cases1_items .item{
    width: 33.333%;
    padding: 0 15px;
  }
  .oem_cases1_items .item:nth-child(n+3){
    margin-top: 0;
  }
  .oem_cases1_items .item:nth-child(n+4){
    margin-top: 50px;
  }

  /* 設計・開発事例 */
  .oem_cases2_items{

  }
  .oem_cases2_items .item{
    padding-top: 90px;
    padding-bottom: 100px;
  }
  .oem_cases2_items .item .box1{
    width: 48.64%;
  }
  .oem_cases2_items .item .box2{
    width: 42.79%;
  }

  /* 対応の流れ */
  .oem_flow_items{

  }
  .oem_flow_items .item{
  }
  .oem_flow_items .item .inner{
    padding: 0 190px;
  }
  .oem_flow_items .item .title{
    font-size: 20.56px;
    margin-bottom: 75px;
  }
  .oem_flow_items .item .num{
    font-size: 120px;
  }
  .oem_flow_items .item .txt{
  }

  .oem_cases1_items .item .list_colmun{

  }
  .oem_cases1_items .item .list_colmun ul{
    width: 49%;
  }

}

/* **********************************
 *  お問い合わせ
 * ********************************* */
.pg_contact{

}
.pg_contact .section.sec1{

}
.pg_contact .section.sec2{
  padding-top: 50px;
}
.pg_contact .section.sec3{
  padding-top: 80px;
}

.contact_msg1{
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.075em;
  line-height: 1.875;
}

.contact_form th .require,
.contact_form th .optional{
  display: inline-block;
  width: 52px;
  padding: 1px 5px;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-align: center;
  float: right;
}
.contact_form th .require{
  background: #b80000;
}
.contact_form th .optional{
  background: #d3d3d3;

}

@media (max-width:374px){

}
@media (min-width:375px){

}
@media (max-width:767px){

}
@media (min-width:768px){
  .pg_contact .section.sec2{
    padding-top: 80px;
  }

  .pg_contact .section.sec3{
    padding-top: 150px;
  }

}
@media (min-width:1024px){


}
@media (min-width:1200px){


}


/* **********************************
 *  ライブカメラ
 * ********************************* */
.pg_live{

}
.pg_live .section.sec1{

}

.live_youtube{

}
.live_youtube_txt{
  font-size: 16px;
  letter-spacing: 0.075em;
  line-height: 1.875;
  margin-top: 20px;
}

.live_youtube_btn{

}

@media (max-width:374px){

}
@media (min-width:375px){

}
@media (max-width:767px){

}
@media (min-width:768px){

  .live_youtube{

  }
  .live_youtube_txt{
    margin-top: 40px;
  }

}
@media (min-width:1024px){


}
@media (min-width:1200px){

  .live_youtube_btn{
    margin-top: 65px;
  }

}

/* **********************************
 *  
 * ********************************* */
.pg_terms{

}
.pg_terms .section{
  padding-top: 50px;
  padding-bottom: 50px;
}
.pg_terms .section + .section{

}
.pg_terms .section.sec1{
  padding: 0;
}
.pg_terms .section.sec2{
  margin-top: 25px;
}
.pg_terms .section.sec3{
  background: #f1f5f8;
}
.pg_terms .section.sec4{

}
.pg_terms .section.sec5{
  background: #f1f5f8;
}
.pg_terms .section#sec5{
  padding-top: 30px;
  padding-bottom: 0;
}


/* 文章 */
.terms_wrap{
  font-size: 16px;
  letter-spacing: 0.075em;
  line-height: 1.875;
}
.terms_wrap .txt1{

}
.terms_wrap .txt1.date{
  margin-bottom: 8px;
}
.terms_wrap .list1{

}
.terms_wrap .list1 li{
  text-indent: -1em;
  padding-left: 1em;
}
.terms_wrap .list2{
}
.terms_wrap .list2 .item{

}
.terms_wrap .list2 .item + .item{
  margin-top: 20px;
}
.terms_wrap .list2 .item .title{
  font-size: 16px;
  font-weight: 500;
  color: #261a5d;
}
.terms_wrap .list2 .item .txt{
  padding-left: 1.2em;
}
.terms_wrap .list2 .item .txt2{
  padding-left: 37px;
}
.terms_wrap .list2 .item ul{

}
.terms_wrap .list2 .item ul li{
  text-indent: -1em;
  padding-left: 1em;
}
.terms_wrap .list2 .item ul li+li{
  margin-top: 1.875em;
}

/* テーブル */
.terms_tbl{

}
.terms_tbl th,
.terms_tbl td{
  font-size: 16px;
  letter-spacing: 0.075em;
  line-height: 1.875;
  border: 1px solid #6f6e80;
  padding: 10px;
}
.terms_tbl th{
  font-weight: 500;
  background: #e8e8e8;
  text-align: left;
}
.terms_tbl td{

}


.pg_terms .section#sec5 dl{
  display: flex;
}
.pg_terms .section#sec5 dl dt{
  width: 90px;
}
.pg_terms .section#sec5 dl dt:after{
  content: "：";
  float: right;
}
.pg_terms .section#sec5 dl dd{
  width: calc(100% - 90px);
}
.pg_terms .section#sec5 .info{
  margin-top: 30px;
}
.pg_terms .section#sec5 .link_1{
  margin-top: 52px;
}


@media (max-width:374px){

}
@media (min-width:375px){

}
@media (max-width:767px){

  /* テーブル */
  .terms_tbl{
    border-bottom: 1px solid #6f6e80;
  }
  .terms_tbl,
  .terms_tbl tr,
  .terms_tbl th,
  .terms_tbl td{
    display: block;
    width: 100%;
  }
  .terms_tbl th,
  .terms_tbl td{
    border-bottom: 0;
  }
  .terms_tbl th{
  }
  .terms_tbl td{
  }
}
@media (min-width:768px){


  .pg_terms .section{
    padding-top: 90px;
    padding-bottom: 90px;
  }
  .pg_terms .section + .section{

  }
  .pg_terms .section.sec1{

  }
  .pg_terms .section.sec2{
    margin-top: 25px;
  }
  .pg_terms .section.sec3{
  }
  .pg_terms .section.sec4{

  }
  .pg_terms .section.sec5{
  }

  /* 文章 */
  .terms_wrap{
    font-size: 16px;
  }
  .terms_wrap .txt1{

  }
  .terms_wrap .list1{

  }
  .terms_wrap .list1 li{
  }
  .terms_wrap .list2{
  }
  .terms_wrap .list2 .item{

  }
  .terms_wrap .list2 .item + .item{
    margin-top: 30px;
  }
  .terms_wrap .list2 .item .title{
    font-size: 16px;
  }
  .terms_wrap .list2 .item .txt{
    padding-left: 1.2em;
  }

  /* テーブル */
  .terms_tbl{

  }
  .terms_tbl th,
  .terms_tbl td{
    font-size: 16px;
    padding: 12px;
  }
  .terms_tbl th{
    width: 285px;
    border-right: 0;
    text-align: center;
  }
  .terms_tbl td{
    border-left: 0;
    padding-left: 63px;
  }

  
  .pg_terms .section#sec5 {
    padding-top: 60px;
  }
}
@media (min-width:1024px){

  /* 文章 */
  .terms_wrap{
    margin-top: -50px;
  }

}
@media (min-width:1200px){


}