@charset "utf-8";
/* CSS Document */
/*  PC 1200px レスポンシブル設定は890px～ 1em = 16px */

article{width: 100%; margin: auto;}

/* ページタイトル */
#page_title{width: 100%; display: block; background-color: #f5f5f5;　box-shadow: inset 0px 1px 5px rgba(0, 0, 0, 0.20); border-bottom: 1px solid #e5e5e5; 
	padding: 30px 0px; font-size: 22px; font-weight: lighter; line-height: 110%; text-shadow: 0 1px #ffffff; margin: 0 auto;}
#page_title h1{max-width:950px; width: calc(100% - 20px); padding: 0 10px; font-size: 22px; font-weight: normal; display: block; text-align: left; margin: auto;}

/* パンくずリスト */
#page_title + nav{max-width:950px; width: calc(100% - 20px); padding: 10px 10px; margin: auto; }
#page_title + nav ul{width: 100%; display: flex; justify-content: flex-start; align-items: center; font-size: 11px; line-height: 24px;}
#page_title + nav ul li{position: relative; color: #999;}
#page_title + nav ul li:not(:last-child):after{content: " » "; display: inline-block; width: 10px; height: 10px; padding: 0 2px 0 6px;}
#page_title + nav ul li a{color: #2069c9; text-decoration: underline;}


/* コンテンツ大枠 */
#page_contents{max-width:950px; width: calc(100% - 20px); padding: 0 10px; margin: auto; display: flex; font-size: 14px;}
#page_contents #page_contents_detail{width: calc(100% - 250px);}
#page_contents #page_contents_menu{width: 220px; margin-left: 30px;}

@media screen and (max-width: 890px) {
	/*
	#page_contents{width: calc(100% - 20px); padding: 0 10px; flex-wrap: wrap;}
	#page_contents #page_contents_detail{width: 100%;}
	#page_contents #page_contents_menu{width: 100%; margin-left: 0px;}	
	*/
	#page_contents{width: calc(100% - 0px); padding: 0 0 70px; flex-wrap: wrap;}
	#page_contents #page_contents_detail{width: calc(100% - 20px); padding: 0 10px;}
	#page_contents #page_contents_menu{width: 100%; margin-left: 0px;}	
}

/* 右メニュー */
#app_tech_menu_tmp{position: sticky; top:10px; z-index: 9;}
#app_tech_menu_tmp nav ul{width: 100%; margin: 0px 0px;}
#app_tech_menu_tmp nav ul li a{display: block; padding: 13px 10px 11px 10px; text-decoration: none; color: #666; border-bottom: 1px solid #eeeeee; line-height: 128.6%; position: relative;}
#app_tech_menu_tmp nav ul li a:before{content: ""; display: block; background: url(../img/arrow_gray.png) right bottom no-repeat; width: 10px; height: 10px; position: absolute; bottom: 0px; right: 0px;}
#app_tech_menu_tmp nav ul li a:hover{background: #eeeeee;}
#app_tech_menu_tmp nav ul li a:hover:before{content: ""; display: block; background: url(../img/arrow_bk.png) right bottom no-repeat; width: 10px; height: 10px; position: absolute; bottom: 0px; right: 0px;}

#app_tech_menu_tmp nav ul li a.active{background: #eeeeee;}
#app_tech_menu_tmp nav ul li a.active:before{content: ""; display: block; background: url(../img/arrow_bk.png) right bottom no-repeat; width: 10px; height: 10px; position: absolute; bottom: 0px; right: 0px;}

@media screen and (max-width: 890px) {
	#app_tech_menu_tmp{position: relative; z-index: 9;}
}

/* コンテンツ */
#page_contents #page_contents_detail h2{border-bottom: 3px solid #2069c9; padding: 20px 15px 15px; margin: 0px 0px 25px; 
	font-size: 128.6%; font-weight: bold; color: #333;}

#page_contents #page_contents_detail h3{color: #2069c9; font-size: 16px; font-weight: bold; margin: 30px 0px 20px; padding: 10px 0px 5px; border-bottom: 1px dotted #eeeeee;}

#page_contents #page_contents_detail .flex{width: 100%; display: flex;}
#page_contents #page_contents_detail .flex .flex_50{width: 50%;}

#page_contents #page_contents_detail p{line-height: 170%; }

#page_contents #page_contents_detail ul.item_lst_col3{display: flex; justify-content: flex-start; align-items: center;}
#page_contents #page_contents_detail ul.item_lst_col3 li{width: 33%;}
#page_contents #page_contents_detail ul.item_lst_col3 li a{display: block;}
#page_contents #page_contents_detail ul.item_lst_col3 li img{width: 100%; height: auto; border: 2px solid #cfcfcf;}

#page_contents #page_contents_detail ul.item_lst_col2{display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap;}
#page_contents #page_contents_detail ul.item_lst_col2 li{width: calc(50% - 4px);}
#page_contents #page_contents_detail ul.item_lst_col2 li a{display: block;}
#page_contents #page_contents_detail ul.item_lst_col2 li img{width: 100%; height: auto; border: 2px solid #cfcfcf;}

@media screen and (max-width: 890px) {
	#page_contents #page_contents_detail img{/*width: calc(100% - 20px); */ width: auto; height: auto; /*margin: auto 10px 10px;*/ margin: auto auto 10px;}
	#page_contents #page_contents_detail .flex{width: 100%; display: flex; flex-wrap: wrap;}
	#page_contents #page_contents_detail .flex .flex_50{width: 100%; text-align: center;}
	#page_contents #page_contents_detail ul.item_lst_col3{align-items: flex-start;}
	#page_contents #page_contents_detail ul.item_lst_col3 li img{margin: auto!important; }
}

/* お問い合わせ */
#page_contents #page_contents_detail #contact{width: 100%; display: flex; justify-content: flex-start; align-items: center; margin: 35px auto 30px; padding: 15px 0;
border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6;}
#page_contents #page_contents_detail #contact .contact_phone{width: calc(100% - 350px);}
#page_contents #page_contents_detail #contact .contact_phone dt{font-size: 12px; line-height: 120%;}
#page_contents #page_contents_detail #contact .contact_phone dd{font-size: 24px; font-family: 'Lato', sans-serif; line-height: 100%; font-weight: 900;}
#page_contents #page_contents_detail #contact .contact_phone dd a{color: #2069c9; text-decoration: underline;}
#page_contents #page_contents_detail #contact .contact_phone dd a:hover{text-decoration: none;}
#page_contents #page_contents_detail #contact .contact_mail{width: 350px; min-height: 50px;}
#page_contents #page_contents_detail #contact .contact_mail a{width: 100%; background-color: #2069c9; display: block;}
#page_contents #page_contents_detail #contact .contact_mail a:hover{opacity: 0.8;}

@media screen and (max-width: 890px) {
	#page_contents #page_contents_detail #contact{display: block; text-align: center;}
	#page_contents #page_contents_detail #contact .contact_phone{width: 100%;}
	#page_contents #page_contents_detail #contact .contact_mail{margin: 10px auto;}
	#page_contents #page_contents_detail #contact .contact_mail a img{width: 100%; margin: auto;}
}

.mb_l_10{margin-left: 10px;}
.mb_r_10{margin-right: 10px;}

.mb_l_20{margin-left: 20px;}
.mb_r_20{margin-right: 20px;}

@media screen and (max-width: 890px) {
	.mb_l_10{margin-left: auto;}
	.mb_r_10{margin-right: auto;}
	.mb_l_20{margin-left: auto;}
	.mb_r_20{margin-right: auto;}
}


.mb_10{margin-bottom: 10px;}
.mb_20{margin-bottom: 20px;}
.mb_30{margin-bottom: 30px;}
.mb_40{margin-bottom: 40px;}
.mb_50{margin-bottom: 50px;}

.center{text-align: center;}
.left{text-align: left;}
.right{text-align: right}

.guide_txt_small{color: #808080; font-size: 12px; line-height: 120%!important;}


.youtube {
  width: 100%;
  aspect-ratio: 16 / 9;
}
.youtube iframe {
  width: 100%;
  height: 100%;
}

#page_contents #page_contents_detail a img:hover{opacity: 0.7;}
