@charset "utf-8";
/* CSS Document */
	
#loading {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: 99999;
  background: #fff;
  text-align: center;
}
#loading_box {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#loading .loading_inner {
  width: 100%;
}
#loading .loading_inner .img_area {
  text-align: center;
}
#loading .loading_inner .img_area img {
  max-width: 268px;
 /* height: 38px;*/
	object-fit: contain;
}
.fadeUp {
  animation-name: fadeUpAnime;
  animation-duration: 6s;
  animation-fill-mode: both;
  opacity: 1;
}
@keyframes fadeUpAnime {
  from {
    opacity: 0;
	  transform: scale(1.0); 
  }
  to {
    opacity: 1;
	  transform: scale(1.3); 
  }
}

#loading.is-active {
  opacity: 0;
  visibility: hidden;
}
#loading_box.is-active {
  opacity: 1;
  visibility: visible;
}

@media only screen and (max-width: 767px) {
	#loading .loading_inner .img_area img {
  max-width: 220px;
}
}

/*======================
MV
======================*/
.mv{
	padding-left: 25px;
	padding-right: 25px;
	margin-top: 90px;
}

.mv_video_area{
	width: 100%;
	height: 658px;
	position: relative;
}
.mv_video_area video{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.mv_video_area .catchcopy_area{
	position: absolute;
	left: 60px;
	bottom: 56px;
}

.catchcopy_area .catchcopy .ttl{
	font-size: 65px;
	color: #fff;
	letter-spacing: 20px;
	font-weight: 300;
	margin-bottom: 20px;
}
.catchcopy_area .catchcopy .ttl_en{
	font-size: 20px;
	color: #fff;
	letter-spacing: 2px;
	font-weight: 400;
}


@media only screen and (max-width: 940px) {
.mv{
	padding-left: 20px;
	padding-right: 20px;
	margin-top: 80px;
}
}


@media only screen and (max-width: 768px) {
.catchcopy_area .catchcopy .ttl{
	font-size: 50px;
}
}

@media only screen and (max-width: 767px) {
.mv_video_area{
	height: 90vh;
}
	
.mv_video_area .catchcopy_area{
	left: 0;
	bottom: 50px;
	padding: 0 25px;
}
	.catchcopy_area .catchcopy .ttl{
	font-size: 40px;
		letter-spacing: 10px;
}
	.catchcopy_area .catchcopy .ttl_en{
	font-size: 12px;
}
}



/*======================
トピックス
======================*/
.top_topics{
	padding: 36px 25px;
}

.top_topics .inner{
	display: flex;
	align-items: center;
	background-color: #F8F8F8;
	padding: 25px 30px;
}

.topics_head{
	padding-right: 32px;
}
.topics_head h2{
	font-size: 16px;
}

.top_article_area{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-left: 32px;
	border-left: 1px solid #DADADA;
}
.top_article_area .txt_area{
	display: flex;
	align-items: center;
}
.top_article_area .date{
	font-size: 16px;
	margin-right: 45px;
}
.top_article_area .cat{
	margin-right: 45px;
}
.top_article_area .cat a{
	display: inline-block;
	background-color: #fff;
	border: 1px solid #DADADA;
	border-radius: 3px;
	font-size: 14px;
	padding: 2px 16px;
	width: 110px;
	text-align: center;
}
.top_article_area .article_ttl{
	max-width: 65%;
	padding-right: 45px;
}
.top_article_area .article_ttl a{
	font-size: 16px;
}

.top_article_area .more_btn a{
	width: 165px;
	background-color: #000;
	color: #fff;
	font-size: 13px;
	padding-top: 15px;
	padding-bottom: 15px;
	padding-left: 22px;
}
.top_article_area .more_btn a::after{
	width: 13px;
	height: 13px;
}


@media only screen and (max-width: 940px) {
.top_article_area .txt_area{
	display: block;
}
	.top_article_area .date{
	float: left;
	margin-right: 15px;
}
	.top_article_area .cat{
	margin-right: 0;
}
	.top_article_area .article_ttl{
	max-width: 100%;
		padding-right: 45px;
		margin-top: 10px;
}
	.top_article_area .article_ttl a{
	font-size: 14px;
}
}

@media only screen and (max-width: 767px) {
	.top_topics .inner{
	display: block;
	padding: 20px 25px;
		padding-bottom: 30px;
}
.top_article_area{
	display: block;
	padding-left: 0;
	border-left: none;
}
	.top_article_area .txt_area{
		margin-top: 10px;
		margin-bottom: 25px;
	}
	.topics_head{
	padding-right: 0;
		padding-bottom: 15px;
		border-bottom: 1px solid #DADADA;
}
	.top_article_area .article_ttl{
		padding-right: 0;
}
	.top_article_area .more_btn {
		text-align: center;
	}
	.top_article_area .more_btn a{
		text-align: left;
	}
}


/*======================
head
======================*/
.main_head {
	padding-bottom: 28px;
	position: relative;
	margin-bottom: 65px;
}
.main_head::after {
	content: "";
	width: 40px;
	height: 4px;
	position: absolute;
	bottom: 0;
	left: 3px;
	background: linear-gradient(96deg,rgba(59, 183, 255, 1) 0%, rgba(166, 211, 238, 1) 100%);
}
.main_head .ttl_en{
	font-size: 16px;
	color: #3BB7FF;
	margin-bottom: 15px;
	letter-spacing: 1.5px;
	padding-left: 5px;
	font-weight: 400;
}
.main_head .ttl{
	font-size: 34px;
	font-weight: 400;
	letter-spacing: 10px;
}

@media only screen and (max-width: 768px) {

}

@media only screen and (max-width: 767px) {
	.main_head {
	margin-bottom: 45px;
}
.main_head .ttl{
	font-size: 28px;
	letter-spacing: 4px;
}
.main_head .ttl_en{
	margin-bottom: 10px;
}
}


/*======================
About Us
======================*/
.about{
	padding-top: 65px;
	padding-bottom: 100px;
}

.about_flex_wrap {
	display: flex;
	justify-content: flex-end;
	flex-direction: row-reverse;
}

.about_txt_area .main_head{
	margin-bottom: 36px;
}
.about_txt_area .main_head .ttl_en{
	font-size: 20px;
	letter-spacing: 2px;
}
.about_txt_area .main_head .ttl{
	font-size: 38px;
	letter-spacing: 3px;
	line-height: 1.8;
}
.about_txt_area .main_head::after {
	width: 55px;
}
.about_txt_area .txt{
	font-size: 20px;
	line-height: 2;
}

.about_img_area{
	max-width: 485px;
	margin-right: 98px;
}


@media only screen and (max-width: 1024px) {
	.about_img_area{
		max-width: 400px;
	margin-right: 45px;
}
}

@media only screen and (max-width: 940px) {
.about_flex_wrap {
	display: block;
	max-width: 540px;
	margin: 0 auto;
}
	.about_txt_area {
		margin-bottom: 30px;
	}
	.about_img_area{
		width: 100%;
		max-width: 100%;
		margin:  0 auto;
}
}

@media only screen and (max-width: 767px) {
	.about{
	padding-top: 25px;
	padding-bottom: 65px;
}

	.about_txt_area .main_head{
		margin-bottom: 30px;
	}
.about_txt_area .main_head .ttl_en{
	font-size: 16px;
	margin-bottom: 10px;
}
.about_txt_area .main_head .ttl{
	font-size: 24px;
	letter-spacing: 1px;
}
	.about_txt_area .txt{
	font-size: 16px;
}
}


/*======================
サービス紹介
======================*/
.service{
	padding-top: 65px;
	padding-bottom: 125px;
	background-color: #F1F1F1;
}

.service .main_head{
	margin-bottom: 65px;
}

.service_flex_wrap{
display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: 62px;
	grid-row-gap: 42px;
}

.service_item {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	max-width: 305px;
	height: 295px;
	border-radius: 15px;
	background-color: #fff;

}

.service_item img{
	width: 168px;
	height: auto;
	margin-bottom: 25px;
}
/*.service_item:last-of-type img{
	width: 118px;
}*/

.service_item a{
	display: block;
	min-width: 165px;
	font-size: 18px;
	letter-spacing: 2px;
	text-align: center;
	transition: .2s;
	border: 1px solid #848484;
	border-radius: 50px;
	padding: 3px 30px;
}
.service_item a:hover{
	color: #fff;
	background-color: #848484;
}

@media only screen and (max-width: 1024px) {
.service_flex_wrap{
	column-gap: 30px;
	grid-row-gap: 30px;
}
}

@media only screen and (max-width: 768px) {
	.service_flex_wrap{
	grid-template-columns: repeat(2, 1fr);
}
}

@media only screen and (max-width: 767px) {
	.service{
	padding-top: 45px;
	padding-bottom: 65px;
}
	.service .main_head{
	margin-bottom: 45px;
}
	    .service_flex_wrap {
        column-gap: 15px;
        grid-row-gap: 15px;
    }
	.service_item {
	height: 100%;
		padding: 15px;
}
	.service_item img{
	max-width: 110px;
		margin-bottom: 14px;
}
	
.service_item a{
	min-width: 110px;
	padding: 3px 15px;
	font-size: 14px;
}

}

/*モーダル*/
.modal_wrap{
	max-width: 100%;
	margin: 0 auto;
	padding: 35px 55px 45px 55px;
	border-radius: 30px;
	background-color: #fff;
	text-align: left;
}
.modal_head{
	padding-bottom: 20px;
	position: relative;
}
.modal_head::after{
	content: "";
	width: 100%;
	height: 2px;
	position: absolute;
	bottom: 0;
	left: 0;
	background: linear-gradient(96deg,rgba(59, 183, 255, 1) 0%, rgba(166, 211, 238, 1) 100%);
}
.modal_head .ttl_en{
	color: #3BB7FF;
	margin-bottom: 5px;
}
.modal_head .ttl{
	font-size: 30px;
	letter-spacing: 3px;
}

.modal_flex_wrap{
	display: flex;
	justify-content: space-between;
	padding-top: 40px;
}
.modal_flex_wrap .img_area{
	max-width: 465px;
	margin-right: 40px;
}
.modal_flex_wrap .img_area img{
	border-radius: 15px;
}
.modal_flex_wrap .txt_area{
	width: 415px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.modal_flex_wrap .txt_area .more_btn{
	margin-left: auto;
	margin-top: 30px;
}
.modal_flex_wrap .txt_area .more_btn a{
	font-size: 14px;
}

@media only screen and (max-width: 940px) {
	.modal_flex_wrap .img_area{
	max-width: 50%;
}
.modal_flex_wrap .txt_area{
	width: 50%;
}
}


@media only screen and (max-width: 768px) {
	.modal_flex_wrap{
	display: block;
}
		.modal_flex_wrap .img_area{
	max-width: 100%;
	width: 100%;
	margin-right: 0;
	margin-bottom: 30px;
}
.modal_flex_wrap .txt_area{
	width: 100%;
}
	.modal_flex_wrap .txt_area .more_btn{
	margin-left: inherit;
		margin-top: 30px;
}
}

@media only screen and (max-width: 767px) {
	.modal_wrap{
	padding: 35px;
	border-radius: 15px;
}
	.modal_head .ttl{
	font-size: 24px;
	letter-spacing: 2px;
}
	.modal_flex_wrap{
		padding-top: 30px;
	}
}

/*======================
作業実績
======================*/
.work_pc{
	width: 100%;
	padding-top: 145px;
	padding-bottom: 145px;
	background: url( "images/work_bg.jpg") no-repeat top/cover;
}

.work_flex_wrap{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
}

.work_txt_area .main_head{
	margin-bottom: 45px;
}
.work_txt_area .main_head .ttl_en{
	color: #fff;
}
.work_txt_area .main_head .ttl{
	color: #fff;
}
.work_txt_area .main_head::after {
	background: linear-gradient(96deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 100%);
}

.work_txt_area .txt{
	line-height: 2;
}

.work_sp{
	display: none;
}

@media only screen and (max-width: 768px) {
	.work_pc{
	padding-top: 85px;
	padding-bottom: 85px;
}
	.work_flex_wrap{
	display: block;
}
	.work_txt_area{
		margin-bottom: 45px;
	}
}

@media only screen and (max-width: 767px) {
	.work_pc{
		display: none;
	}
.work_sp{
	display: inherit;
}
	.work_head_bg{
		width: 100%;
		padding: 55px 20px 55px 20px;
	background: url( "images/work_bg_sp.jpg") no-repeat center/cover;
	}
	.work_head_bg .main_head{
		margin-bottom: 0;
	}
	.work_head_bg .main_head .ttl{
		color: #fff;
	}
	.work_head_bg .main_head .ttl_en{
		color: #fff;
	}
	.work_head_bg  .main_head::after{
		background: linear-gradient(96deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 100%);
	}
	
	.work_sp .work_txt_area{
		margin-top: 25px;
		margin-bottom: 30px;
	}
	.work_sp .more_btn{
		text-align: center;
	}
}


/*======================
BLUE DRONE WORKSの特長
======================*/
.features{
	padding-top: 125px;
	padding-bottom: 90px;
}

.features .main_head{
	margin-bottom: 90px;
}
.features .main_head .ttl span{
	letter-spacing: 10px;
	font-weight: 500;
}

.features_item{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 35px;
}
.features_item:last-of-type{
	margin-bottom: 0;
}

.features_item.features_reverse{
	flex-direction: row-reverse;
}

.features_item .img_area{
	max-width: 335px;
	margin-right: 55px;
}
.features_item .img_area img{
	border-radius: 30px;
}
.features_item.features_reverse .img_area{
	margin-right: 0;
	margin-left: 55px;
}

.features_item .txt_area{
	max-width: 465px;
}
.features_item .head_area{
	padding-bottom: 30px;
	margin-bottom: 30px;
	border-bottom: 1px solid #DADADA;
}
.features_item .head_area .ttl_en{
	font-size: 14px;
	color: #3BB7FF;
	margin-bottom: 10px;
}
.features_item .head_area .ttl{
	font-size: 26px;
	letter-spacing: 3px;
}

@media only screen and (max-width: 940px) {
.features{
	padding-top: 95px;
}
}

@media only screen and (max-width: 768px) {
.features{
	padding-top: 85px;
}
}

@media only screen and (max-width: 767px) {
	.features{
	padding-top: 65px;
		padding-bottom: 65px;
}
.features .main_head{
	margin-bottom: 45px;
}
.features .main_head .ttl span{
	letter-spacing: 4px;
}
	
.features_item{
	display:block;
}
	.features_item .img_area{
		display: block;
	max-width: 540px;
		margin: 0 auto;
		margin-bottom: 20px;
}
.features_item .img_area img{
	border-radius: 15px;
}
.features_item.features_reverse .img_area{
	margin: 0 auto;
	margin-bottom: 20px;
}
	.features_item .txt_area{
	max-width: 540px;
		margin: 0 auto;
}
	.features_item .head_area{
	padding-bottom: 20px;
	margin-bottom: 20px;
}
	.features_item .head_area .ttl{
	font-size: 22px;
	letter-spacing: 2px;
}
}


/*======================
代表ご挨拶
======================*/
.message{
	padding-top: 85px;
	padding-bottom: 85px;
	background-color: #F8F8F8;
}

.message_flex_wrap{
	display: flex;
	justify-content: center;
}

.message_txt_area{
	width: 100%;
}
.message_txt_area .txt{
	margin-bottom: 40px;
}

.message_img_area{
	max-width: 360px;
	margin-left: 45px;
}
.message_img_area img{
	border-radius: 30px;
}

.message_img_sp{
	display: none;
}

@media only screen and (max-width: 767px) {
	.message{
	padding-top: 65px;
	padding-bottom: 65px;
}
	.message_img_sp{
	display: inherit;
}
	.message_img_pc{
	display: none;
}	
.message_flex_wrap{
	display: block;
	max-width: 540px;
	margin: 0 auto;
}
	.message_txt_area{
	width: 100%;
}
	.message_img_area{
		max-width: 260px;
margin: 0 auto;
		margin-bottom: 30px;
}
}


/*======================
会社情報
======================*/
.company{
	padding-top: 85px;
	padding-bottom: 85px;
}
.company .main_head::after{
	left: 50%;
	transform: translateX(-50%);
}

.company_table{
	max-width: 812px;
	margin: 0 auto;
}

.company_table table{
	width: 100%;
	font-size: 16px;
}
.company_table tr{
	display: flex;
	justify-content: space-between;
}
.company_table tr:first-of-type th{
	border-top: 1px solid #69BAFF;
}
.company_table tr:first-of-type td{
	border-top: 1px solid #D4D4D4;
}

.company_table th{
	width: 170px;
	border-bottom: 1px solid #69BAFF;
	padding-top: 35px;
	padding-bottom: 35px;
	padding-left: 20px;
	text-align: left;
	font-weight: 400;
}
.company_table td{
	width: 605px;
	border-bottom: 1px solid #D4D4D4;
	padding-top: 35px;
	padding-bottom: 35px;
	padding-left: 20px;
	text-align: left;
}

@media only screen and (max-width: 940px) {
.company_table th{
	width: 25%;
}
.company_table td{
	width: 70%;
}
}

@media only screen and (max-width: 767px) {
	.company{
	padding-top: 65px;
	padding-bottom: 65px;
}
	.company_table tr{
	display: block;
}
	.company_table th{
	width: 100%;
		display: block;
		background-color: #69BAFF;
		color: #fff;
		padding: 10px;
		text-align: center;
		border-bottom: none;
}
.company_table td{
	width: 100%;
	display: block;
	padding: 15px 6px;
	border-bottom: none;
}
	.company_table tr:first-of-type th{
	border-top:none;
}
	.company_table tr:first-of-type td{
	border-top: none;
}
		.company_table tr:last-of-type td{
	border-bottom: 1px solid #D4D4D4;
			padding-bottom: 25px;
}
}


/*======================
お問い合わせ
======================*/
.contact{
	padding-top: 85px;
	padding-bottom: 100px;
	background-color: #F8F8F8;
}

@media only screen and (max-width: 767px) {
.contact{
	padding-top: 65px;
	padding-bottom: 85px;
}
}


/*======================
下層ページここから
======================*/
/*======================
トピックス
======================*/
.under_mv{
	width: 100%;
	height: 285px;
	position: relative;
	margin-top: 90px;
}
.under_bg{
	width: 100%;
	height: 285px;
}
.under_bg img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.under_mv_head{
	position: absolute;
	top:50%;
	left: 75px;
	transform: translateY(-50%);
}
.under_mv_head .ttl{
	font-size: 36px;
	letter-spacing:10px;
	font-weight: 400;
}

.under_mv_head .ttl_en{
	font-size: 18px;
	color: #3BB7FF;
	letter-spacing: 2px;
	font-weight: 400;
}

.pankuzu{
	padding-left: 75px;
	font-size: 14px;
	padding-top: 15px;
}

@media only screen and (max-width: 940px) {
	.under_mv{
	margin-top: 80px;
}
	.pankuzu{
	padding-left: 20px;
		padding-right: 20px;
}
}
@media only screen and (max-width: 767px) {
	.under_mv{
	height: 210px;
}
.under_bg{
	height: 210px;
}
	.under_mv_head{
	left: 20px;
}
.under_mv_head .ttl{
	font-size: 28px;
	letter-spacing:5px;
}
.under_mv_head .ttl_en{
	font-size: 16px;
}
}


/*======================
トピックス一覧
======================*/
.topics_pickup{
	background-color: #F8F8F8;
	border-radius: 30px;
	max-width: 95%;
	margin: 0 auto;
		margin-top: 45px;
	padding: 60px ;
	padding-bottom: 85px;
}

.article_list{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: 30px;
	grid-row-gap: 45px;
}
.article_item a{
	display: block;
	max-width: 380px;
	background-color: #fff;
	border-radius: 15px;
	padding: 15px 20px;
	padding-bottom: 25px;
	box-shadow: 3px 3px 24px -6px rgba(106,147,201,0.3);
	transition: .3s;
}
.article_item a:hover{
	opacity: .5;
}

.article_item .img_area{
	width: 100%;
	height: 210px;
	margin-bottom: 20px;
}
.article_item .img_area img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 15px;
}


.article_cat{
	display: inline-block;
	min-width: 110px;
	font-size: 14px;
	background-color: #F1F1F1;
	border-radius: 3px;
	text-align: center;
}

.article_ttl{
	font-size: 16px;
}

.article_item .date{
	font-size: 14px;
	color: #949494;
	margin-top: 35px;
}

@media only screen and (max-width: 1080px) {
	.article_list{
	grid-template-columns: repeat(2, 1fr);
}
	.article_item a{
		margin: 0 auto;
	}
}

@media only screen and (max-width: 860px) {
	.topics_pickup{
		padding-left: 35px;
		padding-right: 35px;
	}
	.article_item .img_area{
	height: 175px;
}
}

@media only screen and (max-width: 767px) {
	.topics_pickup{
		max-width: 90%;
		padding: 25px 10px;
		border-radius: 15px;
		padding-bottom: 65px;
	}
	.article_list{
	display: block;
}
	.article_item{
		margin-bottom: 30px;
	}
	.article_item:last-of-type{
		margin-bottom: 0;
	}
	.article_ttl{
	font-size: 14px;
}
}


.topics{
	padding-top: 85px;
	padding-bottom: 85px;
}


.works{
	padding-top: 85px;
	padding-bottom: 85px;
}

@media only screen and (max-width: 1080px) {
.topics{
	padding-left: 85px;
	padding-right: 85px;
}
}
@media only screen and (max-width: 860px) {
.topics{
	padding-top: 65px;
	padding-left: 45px;
	padding-right: 45px;
}
	.works{
	padding-top: 65px;
}
}

@media only screen and (max-width: 767px) {
.topics{
	padding-top: 45px;
	padding-left: 25px;
	padding-right: 25px;
}
	.topics .container02{
	padding-left: 0;
	padding-right: 0;
}
		.works{
	padding-top: 45px;
}
}

/*======================
トピックス詳細
======================*/
.topics_single{
	padding-top: 75px;
	padding-bottom: 85px;
}

.datail_wrap{
	max-width: 880px;
	margin: 0 auto;
}

.datail_head{
	padding-bottom: 25px;
	position: relative;
}
.datail_head::after{
	content: "";
	width: 100%;
	height: 2px;
	position: absolute;
	bottom: 0;
	left: 0;
	background: linear-gradient(96deg,rgba(59, 183, 255, 1) 0%, rgba(166, 211, 238, 1) 100%);
}

.datail_head .flex_area{
	display: flex;
	margin-bottom: 15px;
}
.datail_head .flex_area .date{
	font-size: 16px;
	margin-right: 30px;
}

.datail_head .article_cat_list{
	display: flex;
	flex-wrap: wrap;
	column-gap: 10px;
}
.datail_head .article_cat a{
	display: inline-block;
	min-width: 110px;
	font-size: 14px;
	background-color: #F1F1F1;
	border-radius: 3px;
	text-align: center;
}

.datail_head .article_ttl{
	font-size: 26px;
	letter-spacing: 2px;
	font-weight: 400;
}

@media only screen and (max-width: 767px) {
	.topics_single{
	padding-top: 55px;
}
	.datail_head .article_ttl{
	font-size: 22px;
}
}

/*datail_body*/
.datail_body{
	padding-top: 40px;
	padding-bottom: 40px;
	position: relative;
}
.datail_body::after{
	content: "";
	width: 100%;
	height: 2px;
	position: absolute;
	bottom: 0;
	left: 0;
	background: linear-gradient(96deg,rgba(59, 183, 255, 1) 0%, rgba(166, 211, 238, 1) 100%);
}

.datail_body .eyecatch_area{
	margin-bottom: 40px;
}
.datail_body .eyecatch_area img{
	width: 100%;
	height: auto;
}

.datail_body p{
	font-size: 16px;
	margin-bottom: 20px;
}

.datail_body ul{
	padding-left: 25px;
	margin-bottom: 30px;
}
.datail_body ul li{
	list-style: disc;
	font-size: 16px;
}

.datail_body a{
	word-break: break-all;
	 color: #2259C7;
	text-decoration: underline;
}
.datail_body a:hover{
	text-decoration: none;
}

.datail_body table{
	font-size: 16px;
}

.datail_body figure img{
	margin-bottom: 30px;
	width: 100%;
}

.datail_body h2{
	font-size: 26px;
	font-weight: 500;
	margin-top: 60px;
	margin-bottom: 15px;
	padding: 10px 20px;
	background-color: #579DD8;
	color: #FFFFFF;
}

.datail_body h3{
	font-size: 24px;
	font-weight: 500;
	border-left: 4px solid 	#3BB7FF;
	padding-left: 20px;
	margin-top: 30px;
	margin-bottom: 15px;
}

.datail_body h4{
	font-size: 20px;
	font-weight: 700;
	color: #14315C;
	margin-top: 30px;
	margin-bottom: 15px;
	position: relative;
	padding-left: 22px;
}
.datail_body h4:before {
	content: "";
    border-radius: 50%;
    width: 10px;
    height: 10px; 
    display: block;
    position: absolute; 
    left: 0; 
    top: 0.55em; 
    background: #3A5B8B; 
    }

@media only screen and (max-width: 767px) {
		.datail_body .eyecatch_area{
	margin-bottom: 30px;
}
	.datail_body p{
	font-size: 14px;
}
	.datail_body h2{
	font-size: 22px;
	margin-top: 40px;
}
	.datail_body h3{
	font-size: 20px;
		padding-left: 15px;
	margin-top: 20px;
	margin-bottom: 20px;
}
	.datail_body h4{
	font-size: 18px;
	margin-top: 20px;
	margin-bottom: 20px;
}
.article_btn a{
	font-size: 14px;
}
	.datail_body ul{
		margin-bottom: 20px;
	}
	.datail_body ul li{
	font-size: 14px;
}
	
	.datail_body table{
	font-size: 14px;
}
}


/*関連記事*/
.related_articles{
	background-color: #F8F8F8;
	border-radius: 30px;
	padding: 55px;
	margin-top: 60px;
}

.related_articles .head_ttl{
	font-size: 34px;
	font-weight: 400;
	letter-spacing: 10px;
	text-align: center;
	margin-bottom: 40px;
}

.related_articles .article_list{
	column-gap: 20px;
}
.related_articles .article_item .img_area{
	height: 165px;
}
.related_articles .article_item .article_ttl{
	font-size: 14px;
}

@media only screen and (max-width: 767px) {
	.related_articles{
	border-radius: 15px;
	padding: 45px 25px;
		padding-bottom: 55px;
}
	.related_articles .head_ttl{
	font-size: 26px;
	letter-spacing: 5px;
}
}


/*SHARE*/
.share{
	margin-top: 45px;
}
.share .head_ttl{
	font-size: 20px;
	letter-spacing: 2px;
	text-align: center;
	margin-bottom: 25px;
}
.share_list{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	column-gap: 15px;
	grid-row-gap: 15px;
}
.share_list a{
	width: 75px;
	height: 75px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	border-radius: 50px;
	box-shadow: 3px 3px 24px -6px rgba(106,147,201,0.5);
}

.share_list .url_copy{
	width: 75px;
	height: 75px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	border-radius: 50px;
	box-shadow: 3px 3px 24px -6px rgba(106,147,201,0.5);
	position: relative;
	cursor: pointer;
	transition: .3s;
}
.share_list .url_copy::before{
	content: "";
	background-image: url("images/icon/icon_copy.png");
	background-repeat: no-repeat;
	background-size: contain;
	width: 25px;
	height: 26px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.share_list .url_copy:hover{
	opacity: .6;
}

.share_list .url_copy input{
	width: 75px;
	height: 75px;
	border-radius: 50px;
	border: none;
	background-color: rgba(255,255,255,0.00);
	cursor: pointer;
	z-index: 99;
}

@media only screen and (max-width: 767px) {
	.share_list a{
	width: 70px;
	height: 70px;
}
}

/*======================
thanks
======================*/
.thanks_wrap{
	padding-top: 120px;
	padding-bottom: 120px;
}

.thanks_inner h2{
	font-size: 36px;
	margin-bottom: 40px;
}

.thanks_inner .txt_area{
	margin-bottom: 60px;
}

@media only screen and (max-width: 767px) {
	.thanks_wrap{
		padding-top: 65px;
	padding-bottom: 65px;
}
.thanks_inner h2{
	font-size: 22px;
	margin-bottom: 25px;
}
	.thanks_inner .txt_area{
	margin-bottom: 30px;
}
}


/*======================
footer
======================*/
.footer_wrap{
	padding: 70px 82px;
}
.footer_wrap .flex_area{
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}

 .footer_txt_area{
	margin-bottom: 35px;
}
.footer_logo{
	margin-bottom: 15px;
	display: flex;
	flex-direction: column;
}

.footer_logo a{
	display: inline-block;
	width: 353px;
}

.footer_logo .instagram{
	width: 24px;
	height: auto;
	margin-top: 10px;
}

.footer_tel{
	display: flex;
	column-gap: 15px;
}
.footer_tel a{
	font-weight: 500;
	font-size: 14px;
}

.copy_sp{
		display: none;
	}

@media only screen and (max-width: 1280px) {
	.copy_pc{
		display: none;
	}
	.copy_sp{
		display: inherit;
	}
	.footer_wrap{
		padding: 65px 40px;
	display: flex;
		flex-direction: column;
		align-items: center;
}
	.footer_wrap .flex_area{
	display: block;
		margin-bottom: 30px;
}
}

@media only screen and (max-width: 767px) {
		.footer_wrap{
		padding: 50px 20px;
}
	.footer_wrap .flex_area{
		margin-bottom: 0;
}
	.footer_logo a{
	width: 315px;
}
}


.footer_nav{
	display: flex;
	align-items: center;
}
.footer_nav_list{
	display: flex;
	margin-right: 30px;
}
.footer_nav_list li{
	padding-right: 25px;
}
.footer_nav_list li:last-of-type{
	padding-right: 0;
}
.footer_nav_list li a{
	display: block;
	font-size: 14px;
	font-weight: 500;
}


.footer_under{
	background-color: #F8F8F8;
}

@media only screen and (max-width: 1280px) {
	
}

@media only screen and (max-width: 767px) {
	.footer_nav{
	display: none;
}
}


/*======================
pagetop
======================*/
.pagetop{
	position: fixed;
	bottom: 15px;
	right: 15px;
	z-index: 99;
}
.pagetop a img{
	width: 65px;
	height: auto;
}




.url-copied {
    display: none;
}
.url-copied span {
    background: #0009;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    font-size: 11px;
    color: #fff;
    padding: 2px 4px;
    box-sizing: border-box;
    line-height: 14px;
    border-radius: 3px;
}