@charset "UTF-8";

/*
========================================

    service > egs >  egs.css
    各サイトごとに自由に設定
    
========================================
*/

/*aside {display: none;}*/

ul#sideNav li.its > ul.category02{display: none;}
ul#sideNav li.egs > ul.category02 {display: block;}
ul#sideNav li.vds > ul.category02{display: none;}

body.egs {
	/*background:linear-gradient(to right, rgba(78,187,170,0.15) 0%, rgba(78,187,170,0.15) 50%, #fff 50%, #fff 100%);#4ebbaa--------基準色
    background:linear-gradient(150deg,  rgba(78,187,170,0.5) 0%, rgba(78,187,170,0.25) 8%, #fff 8%, #fff 92%, rgba(78,187,170,0.25) 92%, rgba(78,187,170,0.5)  100%) no-repeat;*/
	background:linear-gradient(150deg, #fff 0%, #fff 90%, rgba(78,187,170,0.25) 90%, rgba(78,187,170,0.5)  100%) no-repeat;/*下のみ*/
	background-position: 0 0;
	background-size: 100%;
}

main.sub_page {
	/*background:linear-gradient(to right, rgba(78,187,170,0.15) 0%, rgba(78,187,170,0.15) 50%, #fff 50%, #fff 100%);#4ebbaa--------基準色
	background:linear-gradient(150deg,  rgba(78,187,170,0.5) 0%, rgba(78,187,170,0.25) 8%, #fff 8%, #fff 92%, rgba(78,187,170,0.25) 92%, rgba(78,187,170,0.5)  100%) no-repeat;*/
    background:linear-gradient(150deg,  rgba(78,187,170,0.75) 0%, rgba(78,187,170,0.25) 8%, rgba(78,187,170,0) 8%, rgba(78,187,170,0) 100%) no-repeat;/*上のみ*/
	background-position: 0 0;
	background-size: 100%;
	padding-bottom: 80px;
	margin-bottom: 0;
}

@media (min-width: 992px) {

    main.sub_page {
        background-position: 1rem 0;
    }
    
}/*@media end */


@media (min-width: 1200px) {

    main.sub_page {
        background-position: 1.5rem 0;
    }
    
}/*@media end */


/*--------------------------------------------------------
	egs common
	事業部の色指定など（base.css必須）
--------------------------------------------------------*/

main hr {
  margin-top: 1rem;
  margin-bottom: 1rem;
  border: 0;
  border-top: 3px solid #e5f5f2;/*=#4ebbaa*0.15*/
}

main hr.thin {
  border-top: 1px solid #e5f5f2;
}

main hr.hide {
  border-color: transparent;
}

.btn {
    border-radius: 0;
}

/*color*/
/*#4ebbaa--------基準色*/
/*.bg_Rd {}
.bg_Pk {}
.bg_Pp {}
.bg_Dp {}

.bg_Id {}
.bg_Bl {}
.bg_Lb {}
.bg_Cy {}

.bg_Tl {}
.bg_Gr{}*/
.bg_Lg {background-color:#c5e1a5;}
.bg_Lm {background-color:#e6ee9c;}

/*.bg_Ye {}
.bg_Am {}
.bg_Or {}
.bg_Do {}
.bg_Br {}

.text_Rd {}*/
.text_Pk {color:#d81b60;}
/*.text_Pp {}
.text_Dp {}

.text_Id {}*/
.text_Bl {color:#1976d2;}
/*.text_Lb {}
.text_Cy {}*/

.text_Tl {color:#00897b;}
.text_Gr {color:#388e3c;}
/*.text_Lg {}
.text_Lm {}

.text_Ye {}
.text_Am {}
.text_Or {}
.text_Do {}
.text_Br {}*/

.bg-stripe01 {
  background-image: linear-gradient(-45deg,#fff 25%, #e5f5f2 25%, #e5f5f2 50%, #fff 50%, #fff 75%,#e5f5f2 75%, #e5f5f2 );
  background-size: 8px 8px;
}

.bg-line {
    background: linear-gradient(0deg, #fff 45%, #a6ddd4 45%, #a6ddd4 49%,#fff 49%);
}

.marker {
	display:inline !important;
	vertical-align: middle;
    /*background: transparent;*/
    line-height:1.75 !important;/*上記の★印参照*/
	padding:0 0.25rem;
	background:linear-gradient(transparent 75%, transparent 75%);
	/*text-shadow: 1px 1px 0 rgba(255,255,255,0.1), -1px -1px 0 rgba(255,255,255,0.1),
						-1px 1px 0 rgba(255,255,255,0.1), 1px -1px 0 rgba(255,255,255,0.1),
						0px 1px 0 rgba(255,255,255,0.1),  0-1px 0 rgba(255,255,255,0.1),
						-1px 0 0 rgba(255,255,255,0.1), 1px 0 0 rgba(255,255,255,0.1);*/
}

.mk_Bl {background:linear-gradient(transparent 75%, #87ccf9 75%);}
.mk_Pk {background:linear-gradient(transparent 75%, #fbacdb 75%);}

.mk_Bl_w {background:linear-gradient(transparent 40%, #c3e5fc 40%);}
.mk_Pk_w {background:linear-gradient(transparent 40%, #fdd6ed 40%);}


.bg-info {background-color:rgba(78,187,170,0.2);/*#4ebbaa--------基準色*/}
.bg-info02 {background-color:rgba(78,187,170,0.1);/*#4ebbaa*/}

.bg-info03 {border: 8px solid rgba(78,187,170,0.2); border-radius:4px; background-color: #fff;}
.bg-info04 {border: 8px solid rgba(78,187,170,0.1);}

.txt_shadow {text-shadow:0 0 3px rgba(0,0,0,0.25),0 0 3px rgba(0,0,0,0.25),0 0 3px rgba(0,0,0,0.25),0 0 3px rgba(0,0,0,0.25),0 0 3px rgba(0,0,0,0.25),0 0 16px rgba(0,0,0,0.5);}

/*table*/

.table th,
.table td {
  border-color: #a6ddd4;/*=#4ebbaa*0.5*/
}

.table.tableCard th {background-color:#e5f5f2;}/*=#4ebbaa*0.15*/
.table.tableCard td {background-color:#fff;}

.table.tableCard th,
.table.tableCard td {border: 1px solid #a6ddd4;}/*=#4ebbaa*0.5*/

.table .border-bottom {
    border-bottom: 1px solid #a6ddd4 !important;/*=#4ebbaa*0.5*/
}

@media (max-width:991.98px) {
	
.table.tableCard {
	border-bottom: 1px solid #a6ddd4;/*=#4ebbaa*0.5*/
}

.table.tableCard th,
.table.tableCard td {
	width: 100%;
	display: block;
}
	
.table.tableCard  th {
	border-bottom: none;
}
	
.table.tableCard td {
	border-top: none;
	border-bottom: none;
}

}/*@media end*/


/*linkList table*/

.table.linkList  {
	border-bottom: 1px solid #a6ddd4;/*=#4ebbaa*0.5*/
	margin-bottom: 2rem;
}

.table.linkList th {
	width: 12.5%;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	background-color:#edf8f6;/*=#4ebbaa*0.1*/
	text-align-last: justify;
}

.table.linkList td {
	padding: 0;
}

.table.linkList td a.iconBlank {
	position: relative;
	display: block;
	vertical-align: middle;
    /*background: transparent;*/
    line-height:1.75 !important;/*上記の★印参照*/
	padding: 1rem;
	margin-left: 0.5rem;
	margin-right: 0.5rem;
  }

.table.linkList td span.notes {
	display: block;
	padding: 1rem ;
}

.table.linkList td a.iconBlank::before {/*＝.icon .right */
	position: absolute;
	display: block;
	content: "";
	/*filter: drop-shadow(1px 1px 1px rgba(0,0,0,0.6));*/
	line-height:inherit !important;
	width: 1rem;
	height: 1rem;
    top: 50%;
	left:inherit !important;
	right: 0.5rem !important; 
    -webkit-transform: translateY(-50%); 
    -ms-transform: translateY(-50%); 
    transform: translateY(-50%);
    background-image: url(/common2020/cmn_img/icon_totec.png);/*アイコン画像*/
    background-repeat: no-repeat;
	background-size: calc(1200 / 100 * 100%) calc(1200 / 100 * 100%);
	background-position: calc(1000 / 1100 * 100%) calc(400 / 1100 * 100%);
}

.table.linkList.table-striped tbody tr:nth-of-type(odd) {
 	background-color: #edf8f6;/*=#4ebbaa*0.1*/
}

.table.linkList td a.iconBlank:hover,
.table.linkList.table-striped tbody tr:nth-of-type(odd) a.iconBlank:hover{
	/*color: #25348e;*/
	background:linear-gradient(transparent 0%, transparent 25%, #dcf1ee 25%, #dcf1ee 75%,#dcf1ee 75%,transparent 0%,transparent 0%);/*=#4ebbaa*0.2*/
}

/*-------------------------------------------------------------------------
	layout and h_group
------------------------------------------------------------------------*/

section {
    margin: 1.5rem 0;
    /*padding: 1rem;*/
}

@media (min-width: 992px) {
    section {
        margin: 2.5rem 0;
        padding:1.5rem;
    }
}

/*イントロダクション*/

div.introBox {
    position: relative;
    height: 144px;
    background-color: #fff;
}

@media (min-width: 992px) {
    
    div.introBox {
        height: 248px;
        background-color:transparent;
    }
    
}

 .display-top-1 {font-size:calc(1.25rem + .9vw);}
 .display-top-2 {font-size:calc(0.75rem + .45vw);}
 .display-top-3 {font-size:calc(0.625rem + .3vw);}

.sub_page div.introBox p {
    position: absolute;
    top:0;
    left:0;
    color:rgba(255,255,255,0);
    
    font-weight: 500;
    font-style: oblique;
    opacity: 0.5;
    font-size: 2rem;
    line-height: 1.15;
    
    background-image: url("/service/egs/img/bg.jpg");
    background-position: center top;
    background-size: cover;
    
    width: 100%;
    height: 100%;
    padding: 0.5rem;
}

@media (min-width: 992px) {

    .sub_page div.introBox p {

        color: #fff;
        
        -webkit-text-stroke: 1px #fff;
        background-clip: border-box;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;

        background-image: url("/service/egs/img/bg.jpg");
        background-position: center top;
        background-size: cover;
        /*background-image: none;*/
        
        opacity: 0.9;
        /*font-size: 6.25rem;*/
        font-size:calc(5.75rem + .9vw);
        line-height: 1.1;
        width: 85%;
        padding:0.5rem 1rem;
    }
    
}

.sub_page div.h3Box {
    padding:0 1rem;
    height: 100%;
    text-align: center;

    /*flexCenter*/
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.sub_page h3 {
    color: #258e7f;
    font-weight: 700;
    opacity: 1;
    z-index: 1;
    text-shadow:1px 1px 1px #fff,
        1px -1px 1px #fff,
        -1px 1px 1px #fff,
        -1px -1px 1px #fff,
        0 0 32px #fff;
}

.sub_page h4 {
    text-align: center;
    padding:1.5rem;
    margin-bottom: 1rem;
    font-weight: 700;
	/*background:linear-gradient(150deg,  rgba(78,187,170,0.5) 0%, rgba(78,187,170,0.5) 5%, #fff 5%, #fff 95%, rgba(78,187,170,0.5) 95%, rgba(78,187,170,0.5)  100%) no-repeat;*/
    background:linear-gradient(150deg,  rgba(78,187,170,0.5) 0%, rgba(78,187,170,0.5) 14%, #fff 14%, #fff 100%) no-repeat;
	background-position: 0 0;
	background-size: 100%;
    z-index: 1;
    border: 1px solid #b8e4dd;
}

.sub_page h4.bg-none {
    background: none;
}

.sub_page h4 span.flag {
    font-size:0.875rem;
    font-weight: 700;
    display: block;
    text-align: left;
    padding: 0;
    margin-top: -1.25rem;
    margin-left: -1rem;
    margin-bottom: -0.5rem;
    color: #dcf1ee;/*=#4ebbaa*0.2*/
}

.sub_page h4 span.subText {
    text-align: center;
    display: block;
    font-size: 75%;
    font-weight: 400;
    margin-top: 0.5rem;
}

.sub_page h5 {
    text-align: center;
    margin: 2rem;
    color: #099685;
}

@media (min-width: 992px) {
    
    .sub_page h3 {
        font-weight: 700;
    }
    
    .sub_page h4 {
        padding:2.25rem;
        background:linear-gradient(150deg,  rgba(37,142,127,1) 0%, rgba(125,191,149,0.85) 13%, #fff 13%, #fff 100%) no-repeat;/*258e7f_7ebf95 */
        min-height: 116px;
    }
    
    .sub_page h4 span.flag {
        margin-top: -1rem;
        margin-left: -1rem;
        margin-bottom: -0.5rem;
    }

}

/*-------------------------------------------------------------------------
	broken grid
------------------------------------------------------------------------*/

@media (min-width: 1200px) {
    
    .xl-brokenTop05 {
        margin-top: -5%;
    }
    
    .xl-brokenTop10 {
        margin-top: -10%;
    }

    .xl-brokenTop15 {
        margin-top: -15%;
    }
    
    .xl-brokenTop25 {
        margin-top: -25%;
    }

}

/*-------------------------------------------------------------------------
	parts
------------------------------------------------------------------------*/

.figure {
    position: relative;
    margin-bottom: 1.5rem;
}

.figure.sc {
    position: relative;
    border: 1px solid #999;
    margin-bottom: 1.5rem;
}

.figure.sch {
    position: relative;
    border-top: 1px solid #999;
    border-left: 1px solid #999;
    margin-bottom: 1.5rem;
}

span.figure-caption {
    display: inline-block;
    position: absolute;
    background: #4ebbaa;
    color: #fff;
    right: 0;
    bottom: 0;
    padding: 0.25rem 0.5rem;
    white-space: nowrap;
    min-width: 100px;
    text-align: center;
}

/*タブ*/
/*.rowは使用しない----この場合、iOSで崩れる*/

ul.tabBox {
	margin: 0;
	padding: 0;
	width: 100% !important;
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
	border-top: 2px solid transparent;
	border-left: 2px solid transparent;
    
    background: linear-gradient(150deg, #258e7f 0%, #7ebf95 50%,#258e7f 100%)no-repeat;
    /*background: linear-gradient(150deg,  #fff 0%, #fff 5%, #258e7f 5%, #7ebf95 50%, #258e7f 95%, #fff 95%, #fff 100%) no-repeat;*/
	
	display: flex;
	/* justify-content: space-between;子要素の最初と最後のアイテムは端に、残りは等間隔で配置 */
	flex-wrap: wrap;/* 子要素を横複数行に配置 */
	align-items: stretch;/* 子要素を親要素の高さ（または幅）いっぱいに配置 */
}

ul.tabBox li {
	border-top: 2px solid #fff;
	border-left: 2px solid #fff;
	min-height: 96px;
    color: #fff;
}

ul.tabBox li a {
	width:100%;
	height: 100%;
	/*display:table;--------------edgeでpaddingのバグあり*/
	transition:all .2s ease;
	margin: auto;
	vertical-align: middle;
	
	/*flexCenter*/
	display: flex;
    flex-direction: column; /* 子要素を縦方向に揃える */
    justify-content: center; /* 子要素を中央に配置 */
    align-items: center;  /* 子要素を中央に配置 */
}

ul.tabBox li a p {
    width: 100%;
    font-weight: 700;
    text-align: center;
}

ul.tabBox li a span.small  {
    display: block;
    text-align: center;
    color: #fff;
    opacity: 0.5;
    /*-webkit-text-stroke: 1px #fff;
    background-clip: border-box;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-image: url("/service/egs/img/bg.jpg");
    background-position: bottom center;
    background-size: cover;*/
}

ul.tabBox li a:hover {
	cursor: pointer;
    background: linear-gradient(150deg,  #258e7f, #7ebf95, #258e7f) no-repeat;/**/
	background-size: 100% 200%;
	background-position: 0 100%;
    transition:background-position 0.4s;
	filter: brightness(105%) ;
 }

ul.tabBox li a small.opacity50 {
	font-weight: 400;
}

ul.tabBox li.firstShow a {
}
/*色指定
ul.tabBox#sectionTab li.firstShow a {color:#fff; background:#4ebbaa;}*/

ul.tabBox li span.icon {/*=icon icon-lg four06 left middle inner py-3 px-2 px-lg-3 text-center*/
	text-align: center;
	padding: 1rem 0.5rem !important;
}

ul.tabBox li.thin {
	min-height: 62px;/*高さ低め*/
}

ul.tabBox li.reset {
	cursor: pointer;
	transition:all .2s ease;
	min-height: 62px;
}

ul.tabBox li span.icon::before {/*非表示*/
	display: none;
} 

@media (min-width: 992px) {
	
ul.tabBox li {
	min-height: 96px;
}
    
ul.tabBox li span.icon {
	width: 100%;
	padding-left: 2rem !important;
	padding-right: 2rem !important;
	/*border: 1px dotted #000;ガイド*/
}

ul.tabBox li span.icon::before {/*表示*/
	display: block;
} 

}/*@media end*/

/*カード*/

.card {
  border-radius: 0;/*------作成中-----あとで統一する*/
}

ul.cardBox {
	/*max-width: 1080px;*/
}

ul.cardBox li {
	padding: 1rem;
}

ul.cardBox li a,
ul.cardBox li div.nolink/*まだリンク先がない場合*/ {
	display: block;
	width: 100%;
	height: 100%;
	margin:auto;
	padding: 1rem;
	background: #fff;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
	border-left: 2px solid #fff;
	border-radius: 2px;
	overflow: hidden;
	/*max-width: 320px;*/
	max-width: 400px;
	transition:all .2s ease; 
}

ul.cardBox li a:hover {
	background: #fff;
	border: 2px solid #caeae5;/*0.3*/
    box-shadow: 4px 4px 0 #dcf1ee;/*0.2*/
}

ul.cardBox li span.title {
	font-weight: 500;
    color: #099685;
}

dt.card-title {
    margin-bottom: 0.5rem;
}

ul.cardBox li.seminar span.icon,
ul.cardBox li.seminar span.data,
ul.cardBox li.seminar span.area,
ul.cardBox li.seminar span.title,
ul.cardBox li.seminar span.text {
	display: inline-block;
}

ul.cardBox li.seminar span.icon::before {/*アイコン表示なし*/
    display: none !important;
  }

ul.cardBox li.seminar span.icon img {
	width: 100%;
    margin: 0 auto;
	border: 1px solid #ddd;
}

ul.cardBox li.seminar span.data {
	margin-top: 1rem;
}

ul.cardBox li.seminar span.title {
	font-weight: 700;
	font-size: 125% !important;/*=large*/
	margin-top: 0.5rem;
	margin-bottom: 0.5rem;
}

ul.cardBox li.seminar span.text {
	 font-size: 87.5% !important;/*=small*/
}

div.card p.logoCaption {
	margin-top: 0.75rem !important;
	margin-bottom: -0.625rem !important;
	font-weight: 500;
	font-size: 0.75rem;
	color: #666;
	z-index: 2 !important;
	line-height: 1.25;
}

div.card p.logoCaption.xs-s_small {font-size:75% !important;}/*max-width 991.98pxまで.s_smalと同じになるように*/

@media (min-width: 992px) {
	ul.cardBox li {
		padding: 0.5rem;
	}
	
	div.card p.logoCaption {
		font-size: 0.875rem;
	}
	
	div.card p.logoCaption.xs-s_small {
		margin-top: 1.25rem !important;
		margin-bottom: -0.875rem !important;
		font-size: 0.875rem !important;/*p.logoCaption本来の大きさに戻すように*/
	}
}

/*カード用_画像トリミング*/

ul.cardBox li img.card-img-top {/*角版の場合 .ofiとセット必須*/
	max-width: none;
	height:35vw;
}

@media (min-width: 576px) {
	ul.cardBox li img.card-img-top {/*角版の場合 .ofiとセット必須*/
		/*max-height: 128px;*/
        max-height: 172px;
	}
}

@media (min-width: 992px) {
	ul.cardBox li img.card-img-top {/*角版の場合 .ofiとセット必須*/
		max-height: 180px;
	}
}

/*リスト*/

ul.listBox {
	/*max-width: 1080px;*/
}

ul.listBox li {
	padding: 0.25rem 0;
}

ul.listBox li a {
	/*display: block;*/
	width: 100%;
	height: 100%;
	margin:auto;
	padding: 1rem;
	background: #fff;
	border: 2px solid #a6ddd4;
	border-radius: 2px;
	overflow: hidden;
	/*max-width: 320px;*/
	max-width: 400px;
	transition:all .2s ease;
    vertical-align: middle;
    
    /*flexCenter*/
	display: flex;
    flex-direction: column; /* 子要素を縦方向に揃える */
    justify-content: center;  /*子要素を中央に配置 */
    /*align-items: center;    子要素を中央に配置 */
}

ul.listBox li a:hover {
	background: #fff;
	border: 2px solid #a6ddd4;
    padding-right: 0.75rem;
    transition:all .2s ease;
}

ul.listBox li a:hover .icon.right::before {
    top:0;
	/*right: -0.25rem;重要*/
    right: -0.5rem;
}

@media (min-width: 992px) {
	ul.listBox li {
		padding: 0.25rem;
	}
    
    ul.listBox li a {
        max-width: none;
    }
}

/*フローチャート*/

ul.flowChart {
    /*background: linear-gradient(0deg, #ab47bc 0%, #42a5f5 100%);*/
    background: linear-gradient(0deg, rgba(171,71,188,0.85) 0%, rgba(66,165,245,0.85) 100%);
    background: linear-gradient(0deg, rgba(66,165,245,0.85) 0%, rgba(92,107,192,0.85) 100%);
}

ul.flowChart li {
	position: relative;
	margin-bottom: 16px;
}

ul.flowChart li::before {
	content: "";
	position: absolute;
	top: 100%;
	left: 0;
	display: block;
    width: 100%;
    height: 16px;
    background: #fff;
    background:#edf8f6/*rgba(78,187,170,0.1)*/;
}

ul.flowChart li::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -16px;
	border: 16px solid transparent;
	border-top: 16px solid #cacaca;
}

ul.flowChart li:last-child::after {
	content: none ;
}

ul.flowChart li div.item {

	/*display: block;*/
	width: 100%;
	height: 100%;
	margin:auto;
	
	/*background: transparent;*/
    color: #25348e;
	/*border: 2px solid #fff;
	border-radius: 0;*/
    padding: 1rem;
    font-size:112.5%;
    background: rgba(255,255,255,0.65);
    
    /*flexCenter*/
	display: flex;
    flex-direction: column; /* 子要素を縦方向に揃える */
    justify-content: center;  /*子要素を中央に配置 */
    align-items: center;    /*子要素を中央に配置 */

}

@media (min-width: 992px) {

    ul.flowChart {
        /*background: linear-gradient(90deg, #ffffff 8.4%, #42a5f5 8.4%, #ab47bc 91.6%, #ffffff 91.6%);*/
        background: linear-gradient(90deg, #ffffff 8.4%, rgba(66,165,245,0.85) 8.4%, rgba(171,71,188,0.85) 91.6%, #ffffff 91.6%);
        background: linear-gradient(90deg, #edf8f6 8.4%, rgba(92,107,192,0.85) 8.4%, rgba(66,165,245,0.85) 91.6%, #edf8f6 91.6%);
    }

    ul.flowChart li {
        position: relative;
        margin-bottom: 0;
    }

    ul.flowChart li::before {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        left: auto;
        display: block;
        width: 16px;
        height: 100%;
        background: #fff;
        background:#edf8f6/*rgba(78,187,170,0.1)*/;
    }

    ul.flowChart li::after {
        content: "";
        position: absolute;
        top: 30%;
        right: 0;
        left:100%;
        margin-left: -16px;
        margin-top: -16px;
        border: 16px solid transparent;
        border-left: 16px solid #cacaca;
        z-index: 2;
    }

    ul.flowChart li.reverse::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 100%;
        left:0;
        margin-left: 0;
        margin-top: -16px;
        border: 16px solid transparent;
        border-right: 16px solid #cacaca;
        z-index: 2;
    }

    ul.flowChart li div.item {
        width: calc(100% - 16px);
        margin-right: 16px;
        margin-left: 0;
        height: 100%;
        padding: 0 0 8rem 0;
        min-height: 240px;

        /*flexCenter*/
        display: flex;
        flex-direction: column; /* 子要素を縦方向に揃える */
        justify-content: center;  /*子要素を中央に配置 */
        align-items: center;    /*子要素を中央に配置 */
    }

    ul.flowChart li div.item span {
       /* -webkit-writing-mode: vertical-rl;  縦書きにする */
       /*  -ms-writing-mode: tb-rl; 縦書きにする */
       /*  writing-mode: vertical-rl; 縦書きにする */
        letter-spacing: 2px;
    }       

    .text-combine {
        font-family:'Noto Sans JP','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','Osaka','メイリオ','Meiryo','ＭＳ Ｐゴシック','MS PGothic',Sans-Serif;
        -webkit-text-combine: horizontal; /* 英数字の向きを縦にする */
        -ms-text-combine-horizontal: all; /* 英数字の向きを縦にする */
        text-combine-upright: all; /* 英数字の向きを縦にする */
    }

    .tategaki {
        -webkit-writing-mode: vertical-rl; /* 縦書きにする */
        -ms-writing-mode: tb-rl; /* 縦書きにする */
        writing-mode: vertical-rl; /* 縦書きにする */
        letter-spacing: 2px;
    }       

    .mixed{
        -webkit-text-orientation: mixed;
        text-orientation: mixed;
    }

    .upright{
        -webkit-text-orientation: upright;
        text-orientation: upright;
    }

    .sideways{
        -webkit-text-orientation: sideways;
        text-orientation: sideways;
    }

}/*@media end*/

div.chartBox01 {
    width: 100%;
    margin:0;
    position: relative;
}

div.chartBox01 .bar01 {
    position: absolute;
    width: 8%;
    height: 52%;
    top:2%;
    right: 12%;
    border:2px solid rgba(92,107,192,0.35);/*5c6bc0*/
     /*border:2px solid #fff;*/
    background: rgba(255,255,255,0.85);
    box-shadow: 3px 3px 0 rgba(92,107,192,0.1);/*5c6bc0*/
}

div.chartBox01 .bar02 {
    position: absolute;
    width: 8%;
    height: 72%;
    top:22%;
    right: 3%;
    border:2px solid rgba(92,107,192,0.35);/*5c6bc0*/
     /*border:2px solid #fff;*/
    background: rgba(255,255,255,0.85);
    box-shadow: 3px 3px 0 rgba(92,107,192,0.15);/*5c6bc0*/
}

div.chartBox01 div.innerBar {
    width: 100%;
    height: 100%;
	display: flex;
    justify-content: center;
    align-items: center;
}

div.chartBox01 div.innerBar a {
    width: 1rem;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
}

div.chartBox01 p.text {
    -webkit-writing-mode: vertical-rl; /* 縦書きにする */
    -ms-writing-mode: tb-rl; /* 縦書きにする */
    writing-mode: vertical-rl; /* 縦書きにする */
    letter-spacing: 2px;
    white-space: nowrap;
    margin: 1rem 0;/*align-items: center;が効かない場合用*/
}

@media (min-width: 992px) {

    div.chartBox01 {
        width: 100%;
        margin:0;
        position: relative;
        /*padding-bottom: 144px;*/
    }
    
    div.chartBox01 .bar01 {
        position: absolute;
        width: 45%;
        height: 64px;
        top:auto;
        right: auto;
        bottom:86px;
        left:10%;
    }

    div.chartBox01 .bar02 {
       position: absolute;
        width:44%;
        height: 64px;
        top:auto;
        right: auto;
        bottom:16px;
        left: 44%;
    }
    
    div.chartBox01 div.innerBar,
    div.chartBox01 div.innerBar a {
        width: 100%;
        height: 100%;
        text-align: center;
        display: block;
    }

    div.chartBox01 p.text {
        -webkit-writing-mode: horizontal-tb; /* 横書きにする */
        -ms-writing-mode: lr-tb; /*横書きにする */
        writing-mode: horizontal-tb; /* 横書きにする */
        letter-spacing: inherit;
        white-space: nowrap;
        margin: 0;/*line945の取り消し*/
    }

}

/*入れ子のフローチャート*/

/*
 .flowChart02 li.step:nth-child(odd){
     background: #e6e6f3;
}

 .flowChart02 li.step:nth-child(even){
     background: #f2f2f7;
}
*/

.flowChart02 li .row {
    height: 100%;
}

.flowChart02 li.first {
    /*padding: 16px;*/
     padding: 8px 0;
}

.flowChart02 li.first span.large {
    /*flexCenter*/
	display: flex;
    flex-direction: column; /* 子要素を縦方向に揃える */
    justify-content: center; /* 子要素を中央に配置 */
    align-items: center;  /* 子要素を中央に配置 */
    -ms-flex-direction: inherit; /*for IE only   ...これはimg.ofiのためだけの設定...*/
    
    padding: 16px;
    width: 100%;
    height: 100%;
    background: #ccc;
    font-weight: 500;
    color: #25348e;
}

.flowChart02 li.first_sub {
    /*padding:20px 16px;*/
    padding: 8px;
    font-weight: 500;
    color: #25348e;
}

.flowChart02 li.first_sub ul li {
    padding: 1rem;
}

 .flowChart02 .second ul li {
    margin-top: 8px;
    margin-bottom: 8px;
}

 .flowChart02 .second .item {
    height: 100%;
    /*margin: 0 16px;*/
    margin: 0;
    padding: 16px;
    background: rgba(92,107,192,0.05);/*5c6bc0*/
    border: 2px solid rgba(92,107,192,0.25);/*5c6bc0*/

    /*flexCenter*/
	display: flex;
    flex-direction: column; /* 子要素を縦方向に揃える */
    justify-content: center;  /*子要素を中央に配置 */
    /*align-items: center;    子要素を中央に配置 */
    border-radius: 4px;
     
    font-weight: 500;
}

 .flowChart02 .second .item li {
     text-align: left;
     padding-left: 5%;
 }

 .flowChart02 li.step:nth-child(odd) .item {
    /*background: #333880;
    background: linear-gradient(135deg, #333880, #7075b9);
    color: #fff;*/
}

 .flowChart02 li.step:nth-child(even) .item {
    /*background: #39adbf;
    background: linear-gradient(135deg, #39adbf, #a3ced9);
    color: #fff;*/
}

 .flowChart02 .arrow {
	position: relative;
}

 .flowChart02 .arrow.bf::before {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
    margin-top: -16px;
	margin-left: -16px;
	border: 16px solid transparent;
	border-top: 16px solid #cacaca;
	z-index: 2;
}

 .flowChart02 .arrow.af::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -16px;
	border: 16px solid transparent;
	border-top: 16px solid #cacaca;
	z-index: 2;
}

 .flowChart02 .first.arrow.af::after {
    margin-top: -8px;  /*中点・の対策*/
}

 .flowChart02 .arrow.af_long::before {
    display: block;
    width: 32px;
    height: 80px; 
    background:linear-gradient(90deg, transparent 0%, transparent 35%, #cacaca 35%,#cacaca 65%, transparent 65%);

	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -16px;
	border: none !important;
	z-index: 2;
}

 .flowChart02 .arrow.af_long::after {
	content: "";
	position: absolute;
	top: calc(100% + 80px);
	left: 50%;
    margin-top: -8px;
	margin-left: -16px;
	border: 16px solid transparent;
	border-top: 16px solid #cacaca;
	z-index: 2;
}

/*first*/

.flowChart02 li.first.color01 span.large {background: linear-gradient(180deg, rgba(66,165,245,0.25) 0%, #42a5f5 100%);}
.flowChart02 li.first.color01.arrow.af::after {border-top-color: #42a5f5;}

.flowChart02 li.first.color02 span.large {background: linear-gradient(180deg, #ffffff 0%, #60b2c5 100%);}
.flowChart02 li.first.color02.arrow.af::after {border-top-color: #60b2c5;}

.flowChart02 li.first.color03 span.large {background: linear-gradient(180deg, #ffffff 0%, #7ebf95 100%);}
.flowChart02 li.first.color03.arrow.af::after {border-top-color: #7ebf95;}

.flowChart02 li.first.color04 span.large {background: linear-gradient(180deg, #ffffff 0%, #9ccc65 100%);}
.flowChart02 li.first.color04.arrow.af::after {border-top-color: #9ccc65;}

/*first_sub*/

.flowChart02 li.first_sub ul li.color01 {background: linear-gradient(180deg, rgba(66,165,245,0.25) 0%, #42a5f5 100%);}
.flowChart02 li.first_sub ul li.color01.arrow.af::after {border-top-color: #42a5f5;}

.flowChart02 li.first_sub ul li.color02 {background: linear-gradient(180deg, rgba(77,170,227,0.25)  0%, #4daae3 100%);}
.flowChart02 li.first_sub ul li.color02.arrow.af::after {border-top-color: #4daae3;}

.flowChart02 li.first_sub ul li.color03 {background: linear-gradient(180deg, rgba(89,175,209,0.25) 0%, #59afd1 100%);}
.flowChart02 li.first_sub ul li.color03.arrow.af::after {border-top-color: #59afd1;}

.flowChart02 li.first_sub ul li.color04 {background: linear-gradient(180deg, rgba(100,180,191,0.25) 0%, #64b4bf 100%);}
.flowChart02 li.first_sub ul li.color04.arrow.af::after {border-top-color: #64b4bf;}

.flowChart02 li.first_sub ul li.color05 {background: linear-gradient(180deg, rgba(111,185,173,0.25) 0%, #6fb9ad 100%);}
.flowChart02 li.first_sub ul li.color05.arrow.af::after {border-top-color: #6fb9ad;}

.flowChart02 li.first_sub ul li.color06 {background: linear-gradient(180deg, rgba(122,189,155,0.25) 0%, #7abd9b 100%);}
.flowChart02 li.first_sub ul li.color06.arrow.af::after {border-top-color: #7abd9b;}

.flowChart02 li.first_sub ul li.color07 {background: linear-gradient(180deg, rgba(134,194,137,0.25) 0%, #86c289 100%);}
.flowChart02 li.first_sub ul li.color07.arrow.af::after {border-top-color: #86c289;}

.flowChart02 li.first_sub ul li.color08 {background: linear-gradient(180deg, rgba(145,199,119,0.25) 0%, #91c777 100%);}
.flowChart02 li.first_sub ul li.color08.arrow.af::after {border-top-color: #91c777;}

.flowChart02 li.first_sub ul li.color09 {background: linear-gradient(180deg, rgba(156,204,101,0.25) 0%, #9ccc65 100%);}
.flowChart02 li.first_sub ul li.color09.arrow.af::after {border-top-color: #9ccc65;}

@media (min-width: 1200px) {

    .flowChart02 li .row {
        height: 100%;
    }

     .flowChart02 li.first {
        height: 16%;
    }

    .flowChart02 li.first span.large {
        display: block;
        line-height:3rem;  /*中点・の対策*/
    }
    
    .flowChart02 li.first_sub {
        /*height: 10%;*/
        padding: 0 !important;
        height: 7%;
    }
    
    .flowChart02 li.first_sub > ul.row {
        min-height: 44px;/*.flowChart02 .arrow.af::after　22pxに合わせて*/
    }
    
    .flowChart02 li.first_sub ul li {
        padding: 0;
    }

     .flowChart02 li.second {
        /*height: 82%;*/
         height: 72%;
    }
    
     .flowChart02 .second ul li {
        margin-top: 2px;
        margin-bottom: 2px;
    }

     .flowChart02 .second .item {
        margin: 0 1px;
        padding-bottom: 144px;
        justify-content: flex-start;   /* フレックスアイテムを先頭に寄せる */
     }
    
     .flowChart02 .second .item li {
         text-align: left;
         padding-left: 0.25rem;
         font-size:93.75%;
     }

     .flowChart02 li.step {
         /*min-height: 360px !important;*/
         min-height: 630px !important;
    }

     .flowChart02 li.step:nth-child(odd) .item {
        /*box-shadow:0 0 0 1px #e6e6f3 inset;
        border: 2px solid #e6e6f3;*/
    }

     .flowChart02 li.step:nth-child(even) .item {
        /*box-shadow:0 0 0 2px #f2f2f7 inset;
        border: 2px solid #f2f2f7;*/
    }

     .flowChart02 .arrow {
        position: relative;
    }

     .flowChart02 .arrow.bf::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 0;
        right:100%;
        margin-left: -8px;
        margin-top: -16px;
        border: 16px solid transparent;
        border-left: 16px solid #cacaca;
        z-index: 2;
    }

     .flowChart02 .arrow.af::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 0;
        left:100%;
        /*margin-left: -8px;
        margin-top: -16px;
        border: 16px solid transparent;
        border-left: 16px solid #cacaca;*/

        margin-left: 0;
        margin-top: -22px;
        border: 22px solid transparent;
        border-left: 22px solid #cacaca;
        z-index: 2;
    }
    
     .flowChart02 .first.arrow.af::after {
        margin-top:-48px;  /*中点・の対策 上書き*/
        border: 48px solid transparent;
        border-left: 48px solid #cacaca;
    }

     .flowChart02 .arrow.af_long::before {
        display: block;
        width: 100%;
        height: 32px; 
        background:linear-gradient( transparent 0%, transparent 35%, #cacaca 35%,#cacaca 65%, transparent 65%);

        content: "";
        position: absolute;
        top: 50%;
        right: 0;
        left:100%;
        margin-left:-8px;
        margin-top: -16px;
        border: none !important;
        z-index: 2;
    }

     .flowChart02 .arrow.af_long::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 0;
        left:100%;
        margin-left: calc(100% - 8px);
        margin-top: -16px;
        border: 16px solid transparent;
        border-left: 16px solid #cacaca;
        z-index: 2;
    }
    
    /*first*/
    
    .flowChart02 li.first.color01 span.large {background: linear-gradient(90deg, rgba(66,165,245,0.25) 0%, #42a5f5 100%);}
    .flowChart02 li.first.color01.arrow.af::after {
        border-top-color: transparent;
        border-left-color: #42a5f5;
    }
    
    .flowChart02 li.first.color02 span.large {background: linear-gradient(90deg, #ffffff 0%, #60b2c5 100%);}
    .flowChart02 li.first.color02.arrow.af::after {
        border-top-color: transparent;
        border-left-color: #60b2c5;
    }
    
    .flowChart02 li.first.color03 span.large {background: linear-gradient(90deg, #ffffff 0%, #7ebf95 100%);}
    .flowChart02 li.first.color03.arrow.af::after {
        border-top-color: transparent;
        border-left-color: #7ebf95;
    }
    
    .flowChart02 li.first.color04 span.large {background: linear-gradient(90deg, #ffffff 0%, #9ccc65 100%);}
    .flowChart02 li.first.color04.arrow.af::after {
        border-top-color: transparent;
        border-left-color: #9ccc65;
    }

    /*first_sub*/
    
    .flowChart02 li.first_sub ul li.color01 {background: linear-gradient(90deg, rgba(66,165,245,0.25) 0%, #42a5f5 100%);}
    .flowChart02 li.first_sub ul li.color01.arrow.af::after {
        border-top-color: transparent;
        border-left-color: #42a5f5;
    }

    .flowChart02 li.first_sub ul li.color02 {background: linear-gradient(90deg, rgba(77,170,227,0.25)  0%, #4daae3 100%);}
    .flowChart02 li.first_sub ul li.color02.arrow.af::after {
        border-top-color: transparent;
        border-left-color: #4daae3;
    }

    .flowChart02 li.first_sub ul li.color03 {background: linear-gradient(90deg, rgba(89,175,209,0.25) 0%, #59afd1 100%);}
    .flowChart02 li.first_sub ul li.color03.arrow.af::after {
        border-top-color: transparent;
        border-left-color: #59afd1;
    }
    
    .flowChart02 li.first_sub ul li.color04 {background: linear-gradient(90deg, rgba(100,180,191,0.25) 0%, #64b4bf 100%);}
    .flowChart02 li.first_sub ul li.color04.arrow.af::after {
        border-top-color: transparent;
        border-left-color: #64b4bf;
    }

    .flowChart02 li.first_sub ul li.color05 {background: linear-gradient(90deg, rgba(111,185,173,0.25) 0%, #6fb9ad 100%);}
    .flowChart02 li.first_sub ul li.color05.arrow.af::after {
        border-top-color: transparent;
        border-left-color: #6fb9ad;
    }

    .flowChart02 li.first_sub ul li.color06 {background: linear-gradient(90deg, rgba(122,189,155,0.25) 0%, #7abd9b 100%);}
    .flowChart02 li.first_sub ul li.color06.arrow.af::after {
        border-top-color: transparent;
        border-left-color: #7abd9b;
    }

    .flowChart02 li.first_sub ul li.color07 {background: linear-gradient(90deg, rgba(134,194,137,0.25) 0%, #86c289 100%);}
    .flowChart02 li.first_sub ul li.color07.arrow.af::after {
        border-top-color: transparent;
        border-left-color: #86c289;
    }

    .flowChart02 li.first_sub ul li.color08 {background: linear-gradient(90deg, rgba(145,199,119,0.25) 0%, #91c777 100%);}
    .flowChart02 li.first_sub ul li.color08.arrow.af::after {
        border-top-color: transparent;
        border-left-color: #91c777;
    }

    .flowChart02 li.first_sub ul li.color09 {background: linear-gradient(90deg,  rgba(156,204,101,0.25) 0%, #9ccc65 100%);}
    .flowChart02 li.first_sub ul li.color09.arrow.af::after {
        border-top-color: transparent;
        border-left-color: #9ccc65;
    }


}/*@media end*/

div.chartBox02 {
    width: 100%;
    overflow: hidden;
    padding-bottom: 16px;
    margin:0;
    position: relative;
}

div.chartBox02 .bar01 {
    position: absolute;
    width: 8%;
    height: 56%;
    top:2%;
    right: 10%;
    border:2px solid rgba(92,107,192,0.35);/*5c6bc0*/
    background: rgba(255,255,255,0.75);
    box-shadow: 3px 3px 0 rgba(92,107,192,0.1);/*5c6bc0*/
}

div.chartBox02 .bar02 {
    position: absolute;
    width: 8%;
    height: 64%;
    top:33%;
    right: 1%;
    border:2px solid rgba(92,107,192,0.35);/*5c6bc0*/
    background: rgba(255,255,255,0.75);
    box-shadow: 3px 3px 0 rgba(92,107,192,0.1);/*5c6bc0*/
}

div.chartBox02 div.innerBar {
    width: 100%;
    height: 100%;
	display: flex;
    justify-content: center;
    align-items: center;
}

div.chartBox02 div.innerBar a {
    width: 1rem;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
}

div.chartBox02 p.text {
    -webkit-writing-mode: vertical-rl; /* 縦書きにする */
    -ms-writing-mode: tb-rl; /* 縦書きにする */
    writing-mode: vertical-rl; /* 縦書きにする */
    letter-spacing: 2px;
    white-space: nowrap;
    margin: 1rem 0;/*align-items: center;が効かない場合用*/
}

@media (min-width: 1200px) {

    div.chartBox02 {
        width: 100%;
        margin:0;
        position: relative;
        padding-top: 16px;
        padding-bottom: 16px;
        padding-left: 0;
        padding-right: 16px;
        background: rgba(92,107,192,0);/*5c6bc0*/
    }
    
    div.chartBox02 .bar01 {
        position: absolute;
        width: 55%;
        height: 64px;
        top:auto;
        right: auto;
        /*bottom:72px;*/
        bottom:112px;
        left: 6%;
    }

    div.chartBox02 .bar02 {
        position: absolute;
        width:62%;
        height: 64px;
        top:auto;
        right: auto;
        /*bottom:0;*/
        bottom: 40px;
        left: 31.5%;
    }

    div.chartBox02 div.innerBar,
    div.chartBox02 div.innerBar a {
        width: 100%;
        height: 100%;
        text-align: center;
        display: block;
    }

    div.chartBox02 p.text {
        -webkit-writing-mode: horizontal-tb; /* 横書きにする */
        -ms-writing-mode: lr-tb; /*横書きにする */
        writing-mode: horizontal-tb; /* 横書きにする */
        letter-spacing: inherit;
        white-space: nowrap;
        margin: 0;/*line1451の取り消し*/
    }

}

/*棒状のボタン*/

div.btnBar {
	margin: auto;
}

div.btnBar a {
	display: block;
	width: 100%;
	text-align: center;
	font-size: 1em;
	cursor: pointer;
	padding: 0.25rem 0 0.5rem 0;
}

div.btnBar span.icon.top.icon-lgh {
	padding-top: 1rem;
}

/*タイトルバッジ*/

.badgeType {
	display: inline-block;
	padding: 0.25rem 1rem 0.4rem 1rem;
	background-color:#fff;
	border-radius: 3px;
	margin-bottom: 1rem;
}

span.badgeType {/*タイトルの左上のバッジ*/
	display: inline-flex;
	padding: 0.25rem 1rem;
	font-style: oblique;
	font-weight:500;
	font-size: 87.5% !important;
	/*background-color:rgba(230,50,110,0.8) !important;#242c97*/
	background:linear-gradient(135deg, #d81b60  0%, #242c97 100%);
	color:#fff !important;
}

span.badgeType  span.large {
	font-weight:700;
	font-size:150%;
	margin-top: -0.25rem !important;
	margin-bottom: -0.125rem !important;
	padding: 0;
 }

.badge-PC {/*PC専用ページのバッジ*/
	display: inline-block;
	background-color: #fff;
	color: #5c6bc0;
	border: 1px solid #5c6bc0;
	margin-left: 0;
	font-weight: 400;
	padding-right: 0.5rem;
	padding-left: 0.5rem;
	padding-bottom: 0.35rem;
	border-radius: 10rem;
}

/*数字付きリスト*/

/*
ol.number {
	list-style-type: decimal-leading-zero !important;
	background:linear-gradient(217deg, rgba(255,0,0,.8), rgba(255,0,0,0) 70.71%),
      linear-gradient(127deg, rgba(0,255,0,.8), rgba(0,255,0,0) 70.71%),
      linear-gradient(336deg, rgba(0,0,255,.8), rgba(0,0,255,0) 70.71%);

}*/

ol.number li { 
    padding-left: 2.5rem;
	padding-bottom: 0.75rem;
	margin-bottom: 0.75rem;
	border-bottom: 1px dotted #71c9bb;  /*=#242c97*0.8*/
	position: relative;
}

ol.number li::before {
	position: absolute;
	display: block;
	width: 1.75rem;
	height: 1.75rem;
	left:0;
	top:0;
	margin: auto;
	color:#fff;
	background: #71c9bb;  /*=#4ebbaa*0.8*/
	border-radius: 4px;
	text-align: center;
}

ol.number li:nth-child(1)::before {content:"01";}
ol.number li:nth-child(2)::before {content:"02";}
ol.number li:nth-child(3)::before {content:"03";}
ol.number li:nth-child(4)::before {content:"04";}
ol.number li:nth-child(5)::before {content:"05";}
ol.number li:nth-child(6)::before {content:"06";}
ol.number li:nth-child(7)::before {content:"07";}
ol.number li:nth-child(8)::before {content:"08";}
ol.number li:nth-child(9)::before {content:"09";}
ol.number li:nth-child(10)::before {content:"10";}

/*箇条書きボックス形式で見せる場合*/

dl.item {/*箇条書きボックス形式で見せる場合*/
	height: 100%;
	padding: 1rem;
	border: 2px solid #a6ddd4;/*=#4ebbaa*0.5*/
	border-radius:2px; 
	background-color: #fff;
}

dl.item dt {/*-----特長のタイトル*/	
	/*display: block;
	width: 100%;
	text-align: center;
	margin-left:auto;
	margin-right: auto;
	margin-bottom: 1rem;
	padding: 0.25rem 1rem 0.4rem 1rem;
	background-color:#eb5b8b;  =#242c97*0.8
	border-radius:2px;
    color: #fff;*/
}

/*
dl.item dt.merit {-----特長のタイトル	
	display: block;
	width: 100%;
	text-align: center;
	margin-left:auto;
	margin-right: auto;
	margin-bottom: 1rem;
	padding: 0.25rem 1rem 0.4rem 1rem;
	background-color:#eb5b8b;
	border-radius:80px;
    color: #fff;
}

dl.item dt.merit span.icon.left {
}*/

dl.item dd {
	padding: 1rem;	
}

ul.merit,
p.merit {
    border-left:2px solid rgba(78,187,170,0.1);/*#4ebbaa*/
    padding:1rem;
    margin-left: -5px;
}

ul.merit li {
    /*padding:0 1rem 1rem 0;*/
}

ul.merit li dl.number {

}

ul.merit li dl.number dt {
    margin: 0;
    padding: 0 2rem 0 0;
    font-size: 3rem;/*=display-5
    font-style: oblique;*/
    font-weight: 300;
    color: rgba(36,44,151,0.2);
    font-family: 'Oswald', sans-serif;
}


ul.merit li dl.number dt::before {
    content: '';
    display: inline-block;
    /*background: rgba(127,92,192,0.5);*/
    height: 5px;
    width: 16px;
    margin-right: 12px;
    margin-bottom: 5px;
    vertical-align: middle;
    border-top:2px solid rgba(78,187,170,0.1);/*#4ebbaa*/
    border-bottom: 2px solid rgba(78,187,170,0.1);/*#4ebbaa*/
}

/*
ul.merit li dl.number dt::after {
    content: '';
    display: inline-block;
    height: 5px;
    width: 16px;
    margin-left: 18px;
    margin-bottom: 5px;
    vertical-align: middle;
    border-top:2px solid #ccc;
    border-bottom: 2px solid #ccc;
}
*/

ul.merit li dl.number dd,
ul.merit li p.item {
    font-size: 125%
}

@media (max-width: 1199.98px) {

    ul.merit li dl.number dt {font-size:calc(1.375rem + 1.5vw);}/*=display-5*/

}/*@media end*/

@media (max-width: 991.98px) {
    
    /*ul.merit li dl.number dt::before {
        display: none;
    }*/
    
}/*@media end*/


/*可変の円の中にコンテンツを入れる*/

.adjustBox {
    position: relative;
    width: 90%;
    height: auto;
    background: #fff;
	border-radius: 50%;
	overflow: hidden;
    border: 4px solid rgba(78,187,170,0.1);/*#4ebbaa*/
}

.adjustBox::before {
    content: "";
    display: block;
    padding-top: 100%;
}

.adjustBox .inner {
    position: absolute;
    /*top: 0; 
    left: 0;
    width: 120%;画像縦横1920*1600の場合
    height: 120%;*/
    
    width: 100%;
    height: 100%;
    
    top: 50%;
    left: 50%;
    
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}

/*----------------------------------------
　contact専用
----------------------------------------*/

section.contactBox h4 {
    padding: 2rem 0 1.5rem 0;
	text-align: center;
    background: none;
    border: none;
}

section.contactBox dl.frontDesk dt {
	font-size:1.3125rem;
}

section.contactBox span.number,
section.contactBox span.nsm {
	color:#258e7f; 
}

section.contactBox a.contactBtn {
    background:linear-gradient(135deg, #258e7f  0%, #25348e 50%,#258e7f  100%);/*------------------------個別に指定（base.cssを上書き）*/
	background-size: 100% 600%;
	background-position: 0 0;
    transition:background-position 0.4s;
}

section.contactBox a.contactBtn:hover {
    background:linear-gradient(135deg, #258e7f  0%, #25348e 50%,#258e7f  100%);/*------------------------個別に指定（base.cssを上書き）*/
	background-size: 100% 600%;
	background-position: 0 100%;
    transition:background-position 0.4s;
	filter: brightness(105%) saturate(110%);
}

@media (min-width: 992px) {
    
    section.contactBox {
        /*height: 240px;*/
    }

    section.contactBox dl.frontDesk dt {
        font-size:1.5rem;
    }
    
}

/*----------------------------------------
　field専用
----------------------------------------*/

div.introBox.field {
    position: relative;
    height: 100px;
    background-color:transparent;
}

@media (min-width: 992px) {

    div.introBox.field {
        height: 120px;
        background-color:transparent;
    }
    
}

section.title_field01,
section.title_field02,
section.title_field03 {
    position: relative;
    height: 280px;
    margin:0 1rem;
}

section.title_field01 h4,
section.title_field02 h4,
section.title_field03 h4 {
    position: absolute;
    width: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
    background: none;
    border: none;
    color: #fff;
}

section.title_field01 div.sc,
section.title_field02 div.sc,
section.title_field03 div.sc {
    position: absolute;
    width: 100%;
    height: 280px;
    top:0;
    left:0;
    background: rgba(37,52,142,0.2) url("/commonR/cmn_img/blank02.png") repeat;
    background-size: 4px 4px;
}

section.title_field01 {
    background-image: url("/service/egs/img/img_field01.jpg");
    background-size:cover;
    background-position:left 90%;
}

section.title_field02 {
    background-image: url("/service/egs/img/img_field02.jpg");
    background-size:cover;
    background-position:50% 80%;
}

section.title_field03 {
    background-image: url("/service/egs/img/img_field03.jpg");
    background-size:cover;
    background-position:left 40%;
}

.sub_page h5.field {
    font-size:1.5rem;
    color: #333;
    padding-bottom: 1.5rem;
    margin-left: 1rem;
    margin-right: 1rem;
    border-bottom: 4px solid rgba(78,187,170,0.1);
}

h6.field {
    font-weight: 500;
    color: #258e7f;
    padding-left: 32px;
    text-indent: -32px;
    font-size: 1.625rem;
    margin-top: 1rem;
    margin-bottom: 3rem;
}

@media (max-width: 1199.98px) {
    
    h6.field {
        font-size: calc(1rem + .9vw);
        margin-top: 0.5rem;
        margin-bottom: 1rem;
    }
    
}

h6.field::before{
    content: '';
    display: inline-block;
    background: rgba(78,187,170,0.5);/*#4ebbaa*/
    height: 8px;
    width: 16px;
    margin-right: 16px;
    margin-bottom: 4px;
    vertical-align: middle;
}

dl.work {
  display:flex;
  flex-wrap: wrap;
  border-top: none;
}

dl.work dt {
	background: none;
	width: 25%;
	padding-right: 16px;
	padding-left: 36px;/*少し多めに*/
	box-sizing: border-box;
	/*border-top: 1px solid #ccc; */
	margin: 0;
	font-size:1rem;
}

dl.work dd {
  padding-left: 16px;
  margin: 0 0 32px 0;
  border-left: 2px solid rgba(78,187,170,0.35);/*#4ebbaa*/
  /*border-top: 1px solid #ccc; */
  width: 75%;
  background: #fff;
  box-sizing: border-box;
}

@media (max-width:991px) {
	
    dl.work {
        flex-flow: column nowrap;
    }
    dl.work dt,
    dl.work dd{
        width: 100%;
    }

    dl.work dt{
        border-top: 1px solid rgba(78,187,170,0.85);/*#4ebbaa*/
        padding: 14px 8px;
    }
    dl.work dd{
        border-left: none;
        padding: 0 8px 14px 8px;
    }
	
}

_::content, _:future, div.titleBox_h3 div.h3Base:not(*:root) {
opacity: 0.15;　/*Chromeのみ*/
}

_::content, _:future, .sub_page div.h3Base:not(*:root) {
opacity: 0.85 !important;　/*Chromeのみ*/
}
