@charset "utf-8";

@media screen and (max-width: 767px) {}
@media screen and (min-width: 768px), print {}
@media screen and (min-width: 768px) and (max-width: 1023px) {}
/*-------------------------------------------------
共通指定
-------------------------------------------------*/
/* パンくずリスト */
#pan ol{ float: right;}
#pan ol li{ float:left; font-weight: bold; color: #096b91; font-size: 0.7rem;}
#pan ol li a{ color: #096b91; text-decoration: underline;}
#pan ol li a:hover{ text-decoration: none;}
#pan ol > li:before {content:"　\003e　";}
#pan ol > li:first-child:before { content: none;}

/* タイトル */
.second_title_frame_01{ text-align: center;}

.title_01{ font-weight: bold; background: #efeef9; padding: 5px 20px; margin-bottom: 20px;}
.title_02{ font-weight: bold;}

/* フレーム */
.second_contents_frame_01 h2{ text-align: center; font-weight: bold; color: #096b91; line-height: 1.4;}

.box_text_frame_01{ border: 1px solid #096b91; background: #fff; margin-bottom: 60px;}
.box_text_frame_02{ background: #fff;}

/* リスト */
dl.list_text_01{}
dl.list_text_01 dt{ color: #096b91; font-weight: bold;}

dl.list_text_02{ font-size: 0.9em;}
dl.list_text_02 dt{ color: #096b91; font-weight: bold; margin-bottom: 10px;}
dl.list_text_02 dd{ margin-bottom: 20px;}

dl.list_text_03 dt{ font-weight: bold; line-height: 1.4;}

/* ボタン */
.btn_01 a{ padding: 10px 20px; font-weight: bold; color: #fff; background: #ababab; border: none; border-radius: 5px; margin: 5px;}
.btn_01 a:hover{ background: #cbcbcb;}

/* 背景 */


/*ブラウザサイズ別指定*/
@media screen and (max-width: 767px) {
	/* パンくずリスト */
	#pan{ padding-top: 60px;}
	#pan ol{ padding-top: 10px;}
	#pan ol li{ float:left; font-size: 0.7rem;}

	/* タイトル */
	.second_title_frame_01{ padding: 80px 0;}
	.second_title_frame_01 h1 img{ height: 43px; width: auto;}

	.title_02{ font-size: 1.3em; margin-bottom: 6px;}

	/* フレーム */
	.second_contents_frame_01{ padding-bottom: 8vw;}
	.second_contents_frame_01 h2{ font-size: 1.4em; margin-bottom: 40px;}
	.second_contents_frame_01 .pic_01{ margin-bottom: 40px;}

	.second_contents_frame_02{ margin-bottom: 100px;}

	.box_text_frame_01{ padding: 20px 20px 0;}
	.box_text_frame_02{ padding: 20px;}

	/* リスト */
	dl.list_text_01 dt{ border-bottom: 1px solid #096b91; padding: 5px 10px;}
	dl.list_text_01 dd{ padding: 20px 10px;}

	dl.list_text_03{ margin-bottom: 40px;}
	dl.list_text_03 dt{ font-size: 1.2em; margin-bottom: 10px;}
	dl.list_text_03 dd{ margin-bottom: 30px;}

	/* テーブル */

}
@media screen and (min-width: 768px), print {
	/* パンくずリスト */
	#pan{ padding-top: 70px; padding-right: 20px;}
	#pan ol{ padding-top: 16px;}

	/* タイトル */
	.second_title_frame_01{ padding: 80px 0;}
	.second_title_frame_01 h1 img{ width: auto;}

	.title_02{ font-size: 1.5em; margin-bottom: 10px;}

	/* フレーム */
	.second_contents_frame_01{ max-width: 800px; margin: 0 auto; padding-bottom: 60px;}
	.second_contents_frame_01 h2{ font-size: 2em; margin-bottom: 40px;}
	.second_contents_frame_01 .pic_01{ margin-bottom: 40px;}

	.second_contents_frame_02{ margin-bottom: 60px;}

	.box_text_frame_01{ padding: 40px 40px 20px;}
	.box_text_frame_02{ padding: 40px;}

	/* リスト */
	dl.list_text_01{}
	dl.list_text_01 dt{ float: left; font-size: 1.1em; margin-bottom: 20px;}
	dl.list_text_01 dd{ padding-left: 10em; padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #e3e1f2;}

	dl.list_text_03{ margin-bottom: 60px;}
	dl.list_text_03 dt{ font-size: 1.8em;}
	dl.list_text_03 dd{ margin-bottom: 20px;}

	/* テーブル */

	/* 分割 */
	ul.column_x2 > li{ width: calc(50% - 40px * 1 / 2); margin-right: 40px;}
	ul.column_x2 > li:nth-child(2n+2){ margin-right: 0;}
	ul.column_x3 > li{width: calc(33.333% - 20px * 2 / 3); margin-right: 20px;}
	ul.column_x3 > li:nth-child(3n+3){ margin-right: 0;}
	ul.column_x4 > li{width: calc(25% - 40px * 3 / 4); margin-right: 40px;}
	ul.column_x4 > li:nth-child(4n+4){ margin-right: 0;}

}
@media screen and (min-width: 768px) and (max-width: 1023px) {
	/* フレーム */
	.box_text_frame_02{ padding: 20px;}

	/* リスト */
	dl.list_text_03{ margin-bottom: 40px;}
	dl.list_text_03 dt{ font-size: 1.5em; margin-bottom: 10px;}

}
/* IEのみ対応 */
@media all and (-ms-high-contrast: none) {
}


/*-------------------------------------------------
レイアウト
-------------------------------------------------*/
/* ■■■ BUSINESS ■■■ */
ul.list_business_01 li h2{ position: absolute; left: 0; right: 0; top: 40%; margin: 0 auto; padding: 0 20px; max-width: 272px;}
ul.list_business_01 li .text_01{ width: 96px; margin: 0 auto 10px;}
ul.list_business_01 li .pic_01{ position: relative; border-radius: 50%; margin-bottom: 20px; overflow: hidden;}
ul.list_business_01 li .text_02{ width: 55px; margin: 0 auto;}
ul.list_business_01 li .text_02::before{ content: ""; display: block; width: 1px; height: 50px; margin: 0 auto 10px; background: #8f018f;}

ul.list_business_02 li{ font-weight: bold;}

#case_01 .business_title_01{ background: url(../business/images/case01_title_bg.jpg) center top no-repeat;}
#case_02 .business_title_01{ background: url(../business/images/case02_title_bg.jpg) center top no-repeat;}
#case_03 .business_title_01{ background: url(../business/images/case03_title_bg.jpg) center top no-repeat;}
#case_04 .business_title_01{ background: url(../business/images/case04_title_bg.jpg) center top no-repeat;}
.business_title_01 p{ text-align: center;}
.business_title_01 p.num_01{ position: relative; margin-bottom: 30px;}
.business_title_01 p.num_01::before{ position: absolute; left: 0; right: 0; bottom: 0; margin: 0 auto; content: ""; display: block; width: 50px; height: 1px; background: #fff;}
.business_title_01 p.num_01 img{ width: 77px;}
.business_title_01 p.subtitle_01{ margin-bottom: 50px;}
.business_title_01 h1{ font-weight: bold; color: #fff; text-align: center; line-height: 1.4;}


.box_case_frame_01, .box_case_frame_02{ clear: both;}
.bg_case_01{ background: linear-gradient(45deg, #e5f8ff 0%, #e5e6f4 50%, #ffe5f4 100%);}
.bg_case_02{ background: linear-gradient(45deg, #ffe5f4 0%, #e5e6f4 50%, #e5f8ff 100%);}

.box_case_pic_01{ position: relative; z-index: 10;}
.box_case_text_01 p{ font-weight: bold;}
.box_case_text_01 a.ec{ display: block; background:none;padding-left: 0;margin-top: 20px;}
.box_case_text_01 a.ec img{ display: block; width: auto;max-width: 100%;}

/* ■■■ PROFILE ■■■ */
ul.list_profile_01 li{ text-indent: -1em; padding-left: 1em; font-size: 0.9em;}
ul.list_profile_01 li::before{ content: "・";}
ul.list_profile_01 li a:hover{ color: #096b91; text-decoration: underline;}

/* ■■■ CONTACT ■■■ */
dl.list_contact_01{ margin-bottom: 20px;}
dl.list_contact_01 dt{ margin-bottom: 5px;}
dl.list_contact_01 dd{ border-bottom: 1px solid #ececec;}
.hissu{ display: inline-block; font-size: 0.6em; background: #096b91; color: #fff; font-weight: bold; padding: 2px 6px; border-radius: 3px;}

/*ブラウザサイズ別指定*/
@media screen and (max-width: 767px) {
	/* ■■■ BUSINESS ■■■ */
	ul.list_business_01 li .pic_01{ width: 280px; height: 280px; margin: 0 auto 20px;}
	ul.list_business_01 li .pic_01 p img{ border-radius: 50%;}
	ul.list_business_01 li .text_02{ margin-bottom: 80px;}

	ul.list_business_02 li{ text-indent: -1.2em; padding-left: 1.2em; margin-bottom: 0.5em; line-height: 1.4;}
	ul.list_business_02 > li::before{ content: "・"; margin-right: 0.2em;}

	.business_title_01{ padding: 80px 20px;}
	.business_title_01 h1{ font-size: 1.5em;}

	.business_contents_frame_01{ padding-bottom: 100px;}

	.box_case_pic_01{ margin-bottom: 40px;}
	.box_case_pic_01 .pic_01{ margin-top: -20px;}
	.box_case_pic_01 .pic_02{ width: 50%;}
	.box_case_text_01 p{ margin-bottom: 1em;}
	.box_case_frame_01 .box_case_pic_01 .pic_02{ margin-top: -20px; margin-left: 20px;}
	.box_case_frame_02 .box_case_pic_01 .pic_02{ margin-top: -50px; margin-left: calc(50% + 10px);}

	/* ■■■ PROFILE ■■■ */
	ul.list_profile_01{ margin-bottom: 40px;}

	/* ■■■ CONTACT ■■■ */
	dl.list_contact_01 dt{ padding-top: 10px;}
	dl.list_contact_01 dt .hissu{ margin-left: 10px; vertical-align: middle;}
	dl.list_contact_01 dd{ padding: 10px 0;}
}
@media screen and (min-width: 768px), print {
	/* ■■■ BUSINESS ■■■ */
	ul.list_business_01 li .pic_01{ width: 100%; height: auto;}
	ul.list_business_01 li .pic_01 p img{ transform: scale(1.0,1.0); -webkit-transition: all 0.3s ease;transition: all  0.3s ease;}
	ul.list_business_01 li a:hover img{ opacity: 1; filter: alpha(opacity=100); -moz-opacity: 1}
	ul.list_business_01 li a:hover .pic_01 p img{ transform: scale(1.2,1.2);}

	.business_title_01{ min-height: 630px; padding: 100px 40px;}
	.business_title_01 p.subtitle_01 img{ width: 416px;}
	.business_title_01 h1{ font-size: 3em;}

	.business_contents_frame_01{ overflow: hidden; min-height: 1330px; padding-bottom: 100px;}

	.box_case_left{ width: 50%; float: left;}
	.box_case_right{ width: 50%; float: right;}

	.box_case_text_01 p{ font-size: 1.5em; line-height: 1.4; padding-right: 80px; margin-bottom: 20px;}
	.box_case_text_01 dl{ padding-right: 80px;}

	.box_case_pic_01 p{ position: absolute;}

	.box_case_frame_01 .box_case_pic_01 .pic_01{ left: 0; top: -60px;}
	.box_case_frame_01 .box_case_pic_01 .pic_02{ right: -30px; top: 220px;}
	.box_case_frame_01 .box_case_text_01{ padding: 90px 0 80px 80px;}

	.box_case_frame_02 .box_case_pic_01 .pic_01{ right: 0; top: -60px;}
	.box_case_frame_02 .box_case_pic_01 .pic_02{ left: -30px; top: 260px;}
	.box_case_frame_02 .box_case_text_01{ padding: 90px 80px 80px 0;}

	/* ■■■ CONTACT ■■■ */
	dl.list_contact_01{}
	dl.list_contact_01 dt{ float: left; clear: both; padding: 10px; width: 13em;}
	dl.list_contact_01 dt .hissu{ float: right;}
	dl.list_contact_01 dd{ padding: 10px; padding-left: 15em;}
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
	/* ■■■ BUSINESS ■■■ */
	ul.list_business_02 li{ text-indent: -1.2em; padding-left: 1.2em; margin-bottom: 0.5em; line-height: 1.4;}
	ul.list_business_02 > li::before{ content: "・"; margin-right: 0.2em;}

	.business_contents_frame_01{ min-height: 0;}

	.box_case_text_01 p{ padding-right: 0; font-size: 1em;}
	.box_case_text_01 dl{ padding-right: 0;}

	.box_case_frame_01 .box_case_pic_01 .pic_02{ top: 150px; width: 200px;}
	.box_case_frame_02 .box_case_pic_01 .pic_02{ top: 150px; width: 200px;}

}
