@charset "UTF-8";
/* CSS Document */

.fv-video-section {
  width: 100%;
}

/* 正方形の動画部分 */
.fv-video-box {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

.fv-video__movie {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 動画の下に配置する画像 */
.fv-bottom-image {
  position: relative;
  z-index: 2;

  width: 100%;
  height: auto;
  display: block;

  /* 動画と少しだけ重ねる */
  margin-top: -17%;
  pointer-events: none;
}


/*--------FVここまで---------*/

.c-head__wrap img{
	margin-bottom: 50px;
}

hr.company__hr{
	margin:30px 0;
}

.ai-movie{
	margin:20px 0 20px;
	width:100%; 
	aspect-ratio:1 / 1; 
	overflow:hidden;
}

.ai-movie video {
	width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
  }

.how-head__wrap img{
	display: block;
    width: 80%;
    margin: 0 auto 50px;
}

.p-how__accordion02 summary {
    position: relative;
}

.p-how__accordion02 .p-howtouse__icon {
    background: url(../images/fitclear/how_arrow_icon.png) no-repeat center center / cover !important;
}

.p-how__accordion02 details[open] .p-howtouse__icon {
    rotate: 180deg;
}

.p-howtouse{
	padding: rem(16) rem(16);
}

#fitclear .c-section-head{
	color:#082657;
}

#fitclear .p-footer{
	background:#0D1B2A;
}

#fitclear input[type="submit"] {
        width: rem(260);
        height: rem(56);
        line-height: rem(56);
        border: none;
        color: $white;
        font-size: rem(16);
        font-weight: 500;
        border-radius: 3px;
        background: #0D1B2A;
        border-radius: rem(4);
        letter-spacing: 0.04em;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-left: auto;
        margin-right: auto;
        cursor: pointer;
        transition: all 0.3s ease;
        @media (hover: hover) {
            &:hover {
                opacity: 0.7;
            }
        }
}

.p-equipment02{
	padding-top: 60px;
}

/*タブ切り替え全体のスタイル*/
.tabs {
  margin-top: 50px;
  padding-bottom: 40px;
  background-color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  width: 100%;
  margin: 0 auto 20px;
}

/*タブのスタイル*/
.tab_item {
  width: calc(100%/3);
  height: 50px;
  border-bottom: 3px solid #0D1B2A;
  background-color: #d9d9d9;
  line-height: 50px;
  font-size: 16px;
  text-align: center;
  color: #565656;
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
}
.tab_item:hover {
  opacity: 0.75;
}

/*ラジオボタンを全て消す*/
input[name="tab_item"] {
  display: none;
}

/*タブ切り替えの中身のスタイル*/
.tab_content {
  display: none;
  padding: 40px 40px 0;
  clear: both;
  overflow: hidden;
}

/*スマホ版*/
/*タブ切り替え全体のスタイル*/
.tabs_sp {
  margin-top: 50px;
  padding-bottom: 20px;
  background-color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  width: 100%;
  margin: 0 auto 20px;
}

/*タブのスタイル*/
.tab_item_sp {
  width: calc(100%/3);
  height: 50px;
  border-bottom: 3px solid #0D1B2A;
  background-color: #d9d9d9;
  line-height: 50px;
  font-size: 16px;
  text-align: center;
  color: #565656;
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
}
.tab_item_sp:hover {
  opacity: 0.75;
}

/*ラジオボタンを全て消す*/
input[name="tab_item_sp"] {
  display: none;
}

/*タブ切り替えの中身のスタイル*/
.tab_content_sp {
  display: none;
  padding: 20px 10px 0;
  clear: both;
  overflow: hidden;
}

/*選択されているタブのコンテンツのみを表示*/
#all:checked ~ #all_content,
#programming:checked ~ #programming_content,
#kumanan:checked ~ #kumanan_content,
#shimizu:checked ~ #shimizu_content{
  display: block;
}

/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item{
  background-color: #0D1B2A;
  color: #fff;
}

.tabs_sp input:checked + .tab_item_sp{
  background-color: #0D1B2A;
  color: #fff;
}

/*FAQエリアカラー変更*/
.p-faq__accordion02 details{
	border: .0625rem solid #0D1B2A;
}

.p-faq__accordion02 details[open] summary {
    border-bottom: 1px solid #0D1B2A;
    border-radius: 0;
}

.p-faq__question02{
	color: #0D1B2A;
}

/*LINE追加ボタンサイズ*/

.p-contact__line-link02{
	width:65%;
}