@charset "UTF-8";
@import "base.css";
@import "fonts.css";
@import "normalize.css";
@import "font-family.css";
@import url('https://fonts.googleapis.com/css?family=Oswald:300,400,500,600,700&display=swap');

/******
font-family: 'Oswald', sans-serif;

****/

body {
	font-family: 'NotoSansCJKjp-Regular';
}

* {
	padding: 0;
	margin: 0;
}

*, *:before, *:after {
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

a {
	color: #1f2674;
}

.box_sp {
	display: none;
}

a:hover, a:active {
	color: #006baf;
	text-decoration: none
}

a:hover img {
	opacity: 0.7;
}

a[target="_blank"]:hover img, .logo a:hover img, .f_logo a:hover img, a:hover img.no-hover {
	opacity: 1;
}

h1, h2, h3, h4, h5, h6, input, button, textarea, select, p, blockquote, th, td, pre, address, li, dt, dd {
	font-size: 180%;
	-webkit-text-size-adjust: none;
}

li, dd, dt, th, td {
	line-height: 2em;
}

img {
	max-width: 100%
}

p {
	line-height: 2em;
	margin: 0 0 1.1em
}

.pc_none {
	display: none;
}

#wrapper {
	min-width: 1260px;
	overflow: hidden
}


/******************************Header********************************/

#header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 2;
	min-width: 1296px;
	opacity: 0.95;
}

.fixed #header {
	background: #fff;
	box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.05);
	-webkit-animation: header-fixed 0.5s;
	-ms-animation: header-fixed 0.75s;
	animation: header-fixed 0.5s;
}

#header .logo {
	line-height: 0;
	float: left;
	margin: 35px 0 0 1.5%;
	padding: 0;
	width: 600px;
}

#header .logo a {
	float: left;
	width: 100%;
	margin: 0 2%;
}


/*******************************************************************/


/******************************Gnavi********************************/

.gnavi-sub_pc {
	position: fixed;
	right: 0;
	margin: 5px 40px 0 0;
}

.gnavi-sub_pc a {
	position: relative;
	top: 18px;
	letter-spacing: 2px;
	transition: 0.2s all;
	line-height: 1.0;
}

.gnavi-sub_pc a:hover {
	opacity: 0.8;
}

ul.gnavi-sub_pc {}

.gnavi-sub_pc li {
	float: left;
}

.gnavi_pc {
	float: right;
	display: flex;
	margin: 72px 40px 20px 5px;
}

.gnavi_pc>li {
	display: inline-block;
	align-self: center;
	text-align: center;
	transition: 0.2s all;
}

.under .gnavi_pc>li {
	margin-bottom: 0;
}

.gnavi_pc a {
	text-decoration: none;
	display: inline-block;
	line-height: 1.6em;
}
.column_link span {
    padding-right: 22px !important;
}

.column_link span:after {
    content: "";
    width: 6px;
    height: 6px;
    border: 1px solid #363636;
    position: absolute;
    transform: rotate(45deg)translate(-1px,-1px);
    border-top: none;
    border-left: none;
    top: 0;
    right: 9px;
    bottom: 0;
    margin: auto;
}

.gnavi_pc>li a,
.gnavi_pc>li.column_link span{
	color: #282828;
	font-size: 16px;
	padding: 0 17px;
	position: relative;
}

.gnavi_pc>li>a:before,
.gnavi_pc>li.column_link span:before{
	content: "";
	width: 1px;
	height: 16px;
	background: #E9E9E9;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
}

.gnavi_pc>li *:hover {
	color: #2E6089
}

.gnavi_pc>li:nth-child(1)>a:before {
	display: none;
}

.gnavi_pc li.column_link a {
	position: relative;
}
.under .column_link li {
  margin: 0;
} 
.gnavi_pc li:nth-child(6) a {
	/* padding: 0 0 0 12px; */
}

.gnavi_pc li.login_link a:after {
	content: "";
	background: url("/kcc/share/images/login_link-icon.png") no-repeat top left;
	background-size: cover;
	width: 20px;
	height: 20px;
	position: absolute;
	top: 3px;
	left: 11px;
}

.gnavi_pc li.login_link {
	margin-left: 0;
}

.gnavi_pc li.login_link a {
	padding: 0 12px 0 35px;
}

/*.gnavi_pc li.column_link span:nth-child(1):after {
	content: "";
	position: absolute;
	left: 14px;
	bottom: 1px;
	width: 85%;
	height: 5px;
	background: #FFF439;
	z-index: -1;
}*/
.gnavi_pc>li.sp-navi_video {
	display: none;
}
li.column_link span {
    cursor: pointer;
  z-index: 1;
  position: relative;
}
li.column_link ul {
  display: none;
}
@media only screen and (min-width: 640px){
  li.column_link ul {
    position: absolute;
    background: white;
    padding: 10px 0;
    margin-top: -10px;
    z-index: 0;
  }
  .column_link .active+ul,
  .column_link ul:hover{
    display: block;
    box-shadow: 0 4px 16px 0 #ccc;
    background: white;
    z-index: 2;
  }
}
.index #mainvisual {
	margin-top: 165px;
	padding: 0 0 80px 0;
	position: relative;
}

.index #mainvisual:after {
	content: "";
	position: absolute;
	background: url(/kcc/share/images/main_bg.png) no-repeat center bottom;
	width: 100%;
	height: 100%;
	background-size: cover;
	left: 0;
	bottom: -28px;
	z-index: -10;
}

.index #mainvisual .container {
	width: 1050px;
	position: relative;
}

.main_img {
	float: right;
	line-height: 0;
	position: relative;
	right: -20px;
	top: 60px;
	width: 510px;
}

.trial_bnr01 {
	position: absolute;
	right: 25px;
	bottom: -65px;
	z-index: 1;
}

.trial_bnr01 img {
	transition: 0.2s all;
}

.trial_bnr01 a {}

.grp_txt {
	float: left;
	width: 540px;
	position: relative;
	z-index: 1;
	margin-top: -36px;
}

.grp_txt p {
	margin-bottom: 0;
	font-size: 16px;
	text-align: center;
}

.grp_txt p span {
	font-weight: bold;
	font-size: 110%;
}

.grp_txt p span:nth-child(1) {
	color: #274e7c;
}

.grp_txt p span:nth-child(2) {
	color: #24757a;
}

.grp_txt p:nth-child(2) {
	margin-left: -25px;
	margin: 29px 0 25px;
}

.index #mainvisual h1 {
	font-size: 47px;
	line-height: 1.34em;
	letter-spacing: 6px;
	margin: 30px 0 13px 0;
}

.index #mainvisual h1 img {
	width: 98%;
}

.blue {
	color: #2A5081
}

.green {
	color: #2F797C
}

.index #mainvisual h1 label {
	display: block;
	margin-bottom: 20px;
	position: relative;
	letter-spacing: 2.7px;
	cursor: text;
	text-align: center;
}

.grp {
	position: relative;
	display: inline-block;
	line-height: 1em
}

.index #mainvisual h1 .sml {
	font-size: 23px;
	position: relative;
	padding: 0 30px;
	display: inline-block;
	line-height: 1.3em;
	letter-spacing: 0;
}

.index #mainvisual .grp:after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -8px;
	width: 100%;
	height: 20px;
	background: #FFF439;
	z-index: -1
}

.index #mainvisual h1 .sml:after, .index #mainvisual h1 .sml:before {
	content: "";
	height: 24px;
	width: 2px;
	background: #282828;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}

.index #mainvisual h1 .sml:after {
	right: 9px;
	transform: translateY(-50%) rotate(15deg);
}

.index #mainvisual h1 .sml:before {
	left: 9px;
	transform: translateY(-50%) rotate(-15deg);
}

.index #mainvisual .date {
	font-family: 'Oswald', sans-serif;
	font-weight: 500;
	font-size: 23px;
	margin: 0 5px 0 3px;
	letter-spacing: 0.5px;
}

.index #mainvisual .sml1 {
	font-size: 16px;
	line-height: 1.4em;
	margin: 15px 0 35px 0;
	letter-spacing: 5.3px;
}

.index #mainvisual .grp1 {
	letter-spacing: 11px
}

.index #mainvisual .img {
	line-height: 0;
	margin-bottom: 10px;
	margin: 0 auto;
}

.index #mainvisual .img li {
	display: inline-block;
	float: left;
	width: 150px;
	margin: 2px;
}

.index #mainvisual .img li:nth-child(1) {
	margin-left: 42px;
}

.index #mainvisual .check {
	margin: 25px 0 0 40px;
	width: 448px;
}

.index #mainvisual .check li {
	margin-bottom: 10px
}

.check li {
	font-size: 18px;
	position: relative;
	border-bottom: 1px solid #828282;
	margin-bottom: 8px;
	line-height: 1.6em;
	padding-bottom: 4px;
	text-align: left
}

.check li:before {
	content: "";
	position: absolute;
	left: -38px;
	top: 5px;
	width: 22px;
	height: 22px;
	background: url(/kcc/share/images/tick.png) no-repeat 0 0px
}

.box_black {
	text-align: center;
	background: #3C3C3C;
	position: relative;
	padding: 17px 0;
}

.box_black._main {
	padding: 27px 0;
}

.box_black:after {
	content: "";
	position: absolute;
	bottom: -30px;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 30px;
	height: 40px;
	background: url(/kcc/share/images/stick.png) no-repeat center;
}

.box_black span {
	font-size: 24px;
	line-height: 1.5em;
	font-family: 'NotoSansCJKjp-Medium';
	color: #fff;
	letter-spacing: 2px;
}

.grp_box {
	display: flex;
	justify-content: space-between;
	flex-flow: wrap;
	margin-bottom: 77px
}

.grp_box li {
	display: inline-block;
	width: 430px;
	position: relative;
}

.grp_box .txt {
	position: absolute;
	top: 28%;
	transform: translateY(-28%);
	left: 0;
	right: 0;
	width: 80%;
	margin: 0 auto;
	font-size: 19px;
	font-family: 'NotoSansCJKjp-Medium';
	line-height: 1.6em;
}

.grp_box .txt .line {
	position: relative;
	display: inline-block;
	color: #2E6089;
}

.grp_box .txt .line:after {
	content: "";
	position: absolute;
	bottom: -5px;
	left: -1px;
	width: 100%;
	height: 4px;
	background: url(/kcc/share/images/line.png) repeat-x bottom;
}

.grp_box li:first-child .line:after {
	background: url(/kcc/share/images/line.png) no-repeat bottom;
}

.grp_box li:nth-child(2) .line:after {
	/* background: url(/kcc/share/images/line1.png) no-repeat bottom; */
}

.grp_box li:before {
	content: "";
	position: absolute;
	width: 72px;
	height: 96px;
}

.grp_box li:nth-child(1):before, .grp_box li:nth-child(3):before {
	left: -118px;
	top: 60px;
	background: url(/kcc/share/images/question01.png) no-repeat 0 0;
	background-size: cover;
}

.grp_box li:nth-child(3):before {
	top: auto;
	bottom: 56px;
}

.grp_box li:nth-child(2):before, .grp_box li:nth-child(4):before {
	right: -130px;
	bottom: 56px;
	background: url(/kcc/share/images/question02.png) no-repeat 0 0;
}

.grp_box li:nth-child(4):before {
	background-size: 56px;
}

.grp_box li:nth-child(3):before {
	background: url(/kcc/share/images/question03.png) no-repeat 0 0;
}

.grp_box li:nth-child(1) .txt, .grp_box li:nth-child(3) .txt {
	padding-left: 35px;
}

.grp_box li:nth-child(2) .txt, .grp_box li:nth-child(4) .txt {
	padding-left: 21px;
}

.grp_box li:first-child {
	margin-left: 13px;
}

.grp_box li .img {
	margin-bottom: 18px
}

.grp_box li:nth-child(2) {
	margin-right: 80px;
}

.grp_box {
	background: url(/kcc/share/images/box01_img01.png) no-repeat center bottom;
	background-size: 251px;
}


/*******************************************************************/

.box01 {
	padding: 73px 0 103px;
	background: url(/kcc/share/images/box01_bgg.png) no-repeat center top -60px;
	background-size: auto
}

.index h3:not(.b05_h3), .box03 h2:not(#idx03), .box04 h2, .box05 h2, .box07 h2, .box08 h2 {
	text-align: center;
	font-size: 36px;
	line-height: 1.5em;
	margin-bottom: 65px;
	font-family: 'NotoSansCJKjp-Medium';
	position: relative;
	letter-spacing: 2px;
	padding-bottom: 10px;
}

.box02 {
	margin-bottom: 0;
}

.box08 h2 {
	margin-bottom: 40px;
}

.index h3:not(.b05_h3):after, .box03 h2:not(#idx03):after, .box04 h2:after, .box05 h2:after, .box07 h2:after, .box08 h2:after {
	content: "";
	width: 800px;
	bottom: 0;
	left: 0;
	right: 0;
	height: 2px;
	position: absolute;
	background: #797979;
	margin: 0 auto
}

.index h3 .en, .box03 h2 .en, .box04 h2 .en, .box05 h2 .en, .box07 h2 .en, .box08 h2 .en {
	display: block;
	font-size: 20px;
	font-family: 'Oswald', sans-serif;
	font-weight: 400;
	letter-spacing: 2.9px;
	margin-bottom: 25px;
	line-height: 1.3em;
	color: #4C4C4C;
}

.box06 {
	padding: 56px 0 70px;
	background: #F3F3F3
}

.idx_step {
	display: flex;
	flex-flow: wrap;
	justify-content: space-between
}

.idx_step li {
	display: inline-block;
	width: 240px;
	position: relative;
}

.idx_step .img {
	position: relative;
}

.idx_step .img:after {
	content: "";
	position: absolute;
	right: -53px;
	top: 50%;
	width: 42px;
	height: 22px;
	transform: translateY(-50%);
	background: url(/kcc/share/images/arr03.png) no-repeat;
	background-size: contain
}

.idx_step li:last-child .img:after {
	display: none
}

.idx_step .img {
	line-height: 0;
	margin-bottom: 43px;
	text-align: center;
}

.idx_step .step {
	position: absolute;
	left: 0;
	top: 2px;
	font-size: 24px;
	font-family: 'Oswald', sans-serif;
	font-weight: 500;
	color: #2A5081;
	z-index: 1
}

.idx_step .step i {
	font-style: normal;
	color: #2A5081;
	font-size: 36px;
	font-weight: 600;
	position: relative;
	top: 2px;
	margin-left: 10px;
}

.idx_step .tit {
	font-size: 20px;
	font-family: 'NotoSansCJKjp-Bold';
	color: #2A5081;
	line-height: 1.4em;
	margin-bottom: 10px;
}

.idx_step .txt {
	font-family: 'NotoSansCJKjp-Regular';
	margin-bottom: 0
}

.index h4, #idx06 {
	text-align: center;
	margin-bottom: 50px;
	font-size: 24px;
	font-family: 'NotoSansCJKjp-Medium';
	color: #2A5081;
	letter-spacing: 3.5px
}

#idx06 {
	letter-spacing: 1.2px;
	margin-bottom: 80px
}

.box07 {
	padding: 113px 0 88px
}

.box07 h3 {
	padding-bottom: 7px;
	margin-bottom: 76px;
}

.box07 h3:after {
	width: 707px
}

.box08 {
	padding: 0px 0 150px;
}

.news-list {
	position: relative;
	width: 820px;
	margin: 0 auto 30px;
}

.news-list li {
	border-bottom: 1px dotted #b5b5b5;
	padding: 9px 0 10px 0;
}

.news-list li span {
	margin: 0 15px 0 8px;
	line-height: 2.5;
}

.news-cat {
	width: 130px;
	display: inline-block;
	font-size: 13px;
	text-align: center;
}

.cat-color-blue {
	background: #2e6089;
	color: #fff;
}

.cat-color-green {
	background: #428a9b;
	color: #ffff;
}

.idx_box {
	display: flex;
	flex-flow: wrap;
	margin: 40px 0 120px;
}

.idx_box .item {
	width: 350px;
	display: inline-block;
	padding: 130px 16px 16px 16px;
	position: relative;
}

.idx_box .item:after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
	bottom: -95px;
	width: 22px;
	height: 50px;
	background: url(/kcc/share/images/arr01.png) no-repeat center;
	color: #2f6089;
}

.idx_box .item.b_green:after {
	background: url(/kcc/share/images/arr02.png) no-repeat center
}

.idx_box .con {
	background: #fff;
	padding: 25px 25px 25px;
	/* height: 435px */
}

.idx_box .img {
	position: relative;
	margin: -85px 0 -5px 0;
	line-height: 0;
	text-align: center;
}

.idx_box .tit {
	position: absolute;
	width: 100%;
	text-align: center;
	left: 0;
	font-size: 15px;
	font-family: 'NotoSansCJKjp-Regular';
	color: #2E6089;
	top: 25px;
	line-height: 1.5;
}

.idx_box .tit span {
	font-size: 20px;
	font-weight: bold;
}

.idx_box .num {
	position: absolute;
	top: -30px;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 60px;
	height: 60px;
	text-align: center;
	background: #2A5081;
	border: 6px solid #fff;
	transform: rotate(45deg);
	font-family: 'Oswald', sans-serif;
	font-weight: 500;
}

.idx_box .num span {
	position: absolute;
	text-align: center;
	transform: rotate(-45deg);
	color: #fff;
	font-size: 24px;
	left: -4px;
	top: 8px;
	width: 100%
}

.b_blue {
	background: #2F6089
}

.b_green {
	background: #3D8793
}

.idx_box .b_green .num {
	background: #2F797C
}

.idx_box .b_green .tit {
	color: #3D8793
}

.idx_box .con .check {
	text-align: center;
}

.idx_box .check li {
	margin-bottom: 15px;
	font-family: 'NotoSansCJKjp-Medium';
}

.idx_box .check li:last-child {
	margin-bottom: 0
}

.check.c_blue, .check.c_green {
	font-size: 16px;
	letter-spacing: -0.5px;
}

.check.c_blue span, .check.c_green span {
	font-size: 22px;
	font-weight: bold;
	display: block;
	letter-spacing: 2px;
}

.check.c_blue {
	color: #2E6089;
}

.check.c_green {
	color: #3D8793;
}

.check.c_blue li {
	color: #2A5081
}

.check.c_green li {
	color: #3D8793
}

.grpbox {
	position: relative;
	background: #EAEFF3;
	padding-bottom: 177px
}

.grpbox .bg {
	padding: 86px 0 170px;
	position: relative;
	height: 310px
}

.grpbox .bg .container {
	position: relative
}

.grpbox.blue .bg {
	background: #2E6089;
}

.grpbox.green {
	padding-bottom: 156px;
}

.grpbox.green .bg {
	background: #3D8793;
}

.grpbox.blue {
	color: #2A5081;
}

.grpbox.green {
	color: #357F87;
	background: #EBF3F5
}

.grpbox.blue.mb {
	padding-bottom: 148px;
	margin-bottom: 150px;
}

.ico_num {
	position: absolute;
	top: -111px;
	left: 0;
	border-radius: 200px;
	font-size: 24px;
	font-family: 'NotoSansCJKjp-Medium';
	text-align: center;
	width: 317px;
	padding: 6px 6px 8px 43px;
	letter-spacing: 2.5px;
	line-height: 1.5em;
	background: #fff
}

.ico_num span {
	position: absolute;
	left: -10px;
	top: -5px;
	font-size: 24px;
	color: #fff;
	text-align: center;
	width: 55px;
	height: 55px;
	z-index: 1;
	padding-top: 8px;
	font-family: 'Oswald', sans-serif;
	font-weight: 500
}

.ico_num span:after {
	content: "";
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	position: absolute;
	transform: rotate(45deg);
	z-index: -1;
	border: 6px solid #fff;
}

.grpbox.blue .ico_num span:after {
	background: #2A5081;
}

.grpbox.green .ico_num span:after {
	background: #2F797C;
}

.grpbox.blue .ico_num {
	color: #2A5081;
	border: 3px solid #2A5081;
}

.grpbox.green .ico_num {
	color: #2F797C;
	border: 3px solid #2F797C;
}

.idx_tit {
	text-align: center;
	font-size: 30px;
	font-family: 'NotoSansCJKjp-Light';
	line-height: 2.1em;
	margin-bottom: 40px;
	letter-spacing: 7px;
}

.idx_tit span {
	font-size: 46px;
}

.idx_tit .hight_l {
	position: relative;
	z-index: 1
}

.idx_tit .hight_l:after {
	content: "";
	position: absolute;
	bottom: 5px;
	width: 98%;
	height: 20px;
	background: #FFF439;
	left: 0;
	z-index: -1
}

.idx_img {
	display: flex;
	justify-content: space-between;
	position: relative;
	width: 1170px;
	margin: -149px auto 0;
}

.idx_img li {
	display: inline-block;
	width: 358px;
}

.idx_img .img {
	margin-bottom: 17px;
	text-align: center;
	padding: 34px 20px 20px;
	background: #fff;
	min-height: 250px
}

.idx_img .img span {
	display: block;
	line-height: 1.5em;
	font-size: 20px;
	font-family: 'NotoSansCJKjp-Medium';
	margin: 6px 0 0 0
}

.idx_img .txt {
	font-size: 17px;
	margin-bottom: 0;
	padding: 0 5px;
	line-height: 2.1em;
}

.idx_img .pt {
	padding-top: 17px
}

.idx_img .tit {
	font-size: 20px;
	line-height: 1.5em
}

.idx_img .mt img {
	position: relative;
	top: 10px
}

.index h4.white {
	color: #fff;
	margin-bottom: 45px;
	line-height: 1.5em;
	font-size: 24px;
	font-family: 'NotoSansCJKjp-Medium';
	position: relative;
	padding-left: 30px;
	letter-spacing: 1.2px;
	text-align: left;
}

.index h4.white:after {
	content: "";
	position: absolute;
	left: 0;
	top: 5px;
	width: 4px;
	background: #fff;
	height: 25px;
}

.index h5, .item_txt h3 {
	color: #fff;
	margin-bottom: 45px;
	line-height: 1.5em;
	font-size: 24px;
	font-family: 'NotoSansCJKjp-Medium';
	position: relative;
	padding-left: 30px;
	letter-spacing: 1.2px;
}

.index h5:after, .item_txt h3:after {
	content: "";
	position: absolute;
	left: 0;
	top: 5px;
	width: 4px;
	background: #fff;
	height: 25px;
}

.box03 {
	padding: 100px 0 130px;
	background: url(/kcc/share/images/box03_bg.jpg) no-repeat center bottom;
	position: relative;
	z-index: 1;
	border-bottom: 1px solid #f6f6f6;
}

.box03 {
	display: none;
}

.box03:before {
	content: "";
	position: absolute;
	height: 100%;
	width: 224px;
	top: 0;
	left: 50%;
	margin-left: -945px;
	background: url(/kcc/share/images/spec.png) no-repeat left 0 top 53%;
	background-size: contain;
	z-index: -1
}

.box03 h2:not(#idx03) {
	text-align: left;
	margin-bottom: 55px;
	padding-bottom: 22px;
	letter-spacing: 2.4px;
}

.box03 h2 .en {
	margin-bottom: 19px
}

.box03 .img {
	background: #fff;
	line-height: 2.7em;
}

.grp_list {
	width: 800px;
	display: flex;
	justify-content: space-between;
	flex-flow: wrap
}

.grp_list li {
	display: inline-block;
	width: 238px;
	margin-bottom: 50px;
}

.grp_list .tit {
	font-size: 20px;
	margin-bottom: 9px;
	line-height: 1.4em;
	text-align: center;
	color: #2A5081;
	font-family: 'NotoSansCJKjp-Bold';
}

.grp_list .tit span {
	display: block;
	font-size: 24px;
	font-family: 'Oswald', sans-serif;
	color: #4C4C4C;
	margin-bottom: 15px;
	font-weight: 500;
}

.box03 h2:not(#idx03):after {
	left: 0;
	right: auto;
}

.grp_list .txt {
	line-height: 1.9em;
	font-size: 16px;
	color: #282828
}

.youtb.container {
	/* margin-top: 156px; */
	display: flex;
	justify-content: space-between;
	padding-left: 44px;
}

.youtb iframe {
	width: 1024px;
	height: 555px
}

.youtb h2 {
	display: table-cell;
	width: 32px;
	writing-mode: vertical-rl;
	-moz-writing-mode: vertical-rl;
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	font-size: 24px;
	font-family: 'Meiryo';
	margin-right: 64px;
	padding-top: 20px;
	position: relative;
	letter-spacing: 1.6px;
	vertical-align: top;
	font-weight: 700;
}

.youtb h2:before {
	/* content: ""; */
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	margin: 0 auto;
	width: 25px;
	height: 4px;
	background: #282828;
}

.box04 {
	padding: 80px 0 28px 0;
	width: 100%;
	overflow: hidden;
	background: url(/kcc/share/images/box04_bg01.jpg) no-repeat center bottom -248px;
}

.box04 h2 .en, .box04 h2 {
	color: #fff
}

.box04 h2:after {
	background: #fff;
	width: 840px
}

.box04 h2 {
	padding-bottom: 16px;
	margin-bottom: 121px;
}

.idx_dt {
	border: 1px solid #4C4C4C;
	padding: 17px 60px 15px;
	width: 460px;
	float: left;
	margin-bottom: 30px;
	background: #fff;
}

.idx_dt dt {
	border-bottom: 1px solid #bbb;
	font-size: 24px;
	font-family: 'NotoSansCJKjp-Medium';
	padding: 0 0 0 20px;
	position: relative;
	margin-bottom: 4px
}

.idx_dt dt:before {
	content: "";
	position: absolute;
	left: 0;
	top: 12px;
	width: 4px;
	height: 25px;
	background: #4C4C4C;
}

.idx_dt.pd {
	padding: 18px 60px 55px;
}

.idx_dt.pd dt {
	margin-bottom: 8px;
}

.idx_dt dd p {
	padding-left: 20px
}

.list_x li {
	position: relative;
	padding-left: 20px;
	text-align: left;
	font-family: 'NotoSansCJKjp-Regular';
}

.list_x li:before {
	position: absolute;
	left: 0px;
	content: "";
	width: 8px;
	height: 1px;
	background: #4C4C4C;
	top: 20px;
}

.idx_dt dd {
	font-family: 'NotoSansCJKjp-Regular';
}

.box_r {
	float: right;
	width: 460px;
	z-index: 1000000;
}

.idx_grp02 {
	padding: 50px 50px 55px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}

.idx_grp02:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	height: 190px;
	width: 100%;
	background: #fff;
	z-index: -1
}

.bg_img {
	margin-bottom: 0;
	line-height: 0;
	text-align: center;
	height: 494px;
	background: url(/kcc/share/images/box04_bg.jpg) no-repeat center;
	background-size: cover
}

.box04 .container {
	margin-top: -357px
}

.box04 .img01 {
	position: absolute;
	bottom: 101px;
	left: -95px;
	margin-bottom: 0;
	line-height: 0;
}

.box05 {
	padding: 0 0 0px;
	margin-bottom: 80px;
}

.box05 h2:not(#idx05) {
	margin-bottom: 120px;
}

.box05 h2 .en {
	margin-bottom: 18px
}

.trial_bnr02 {
	margin: 50px auto 0;
	text-align: center;
}

.trial_bnr02 img {
	transition: 0.2s all;
}

.tit01 {
	text-align: center;
	margin-bottom: 134px;
}

.grp_img01 {
	display: flex;
	justify-content: space-between;
	padding-bottom: 78px;
	margin-bottom: 106px;
	border-bottom: 2px solid #E8E9EA
}

.grp_img01:nth-child(4) {
	padding-bottom: 45px;
	margin-bottom: 95px;
}

.grp_img01.last {
	border-bottom: 0;
	margin-bottom: 100px;
}

.grp_img01 [class *='item_'] {
	display: inline-block;
	width: 50%
}

.grp_img01 .item_img {
	width: 500px;
}

.grp_img01 .item_txt {
	width: 510px;
}

.item_txt .case {
	font-size: 24px;
	color: #2A5081;
	line-height: 1.5em;
	margin: -30px 0 15px 0;
	font-family: 'NotoSansCJKjp-Medium';
	letter-spacing: 1px;
}

.item_txt .case span {
	font-family: 'Oswald', sans-serif;
	font-weight: 600;
	letter-spacing: 1px;
}

.item_txt h3 {
	color: #282828;
	margin-bottom: 26px;
	line-height: 1.7em;
	font-family: 'NotoSansCJKjp-DemiLight';
}

.item_txt h3 span {
	position: relative
}

.item_txt h3 .hl:after {
	content: "";
	position: absolute;
	bottom: 0px;
	width: 100%;
	height: 16px;
	background: #FFF439;
	left: -2px;
	z-index: -1;
}

.item_txt h3:after {
	background: #282828;
	top: 8px;
}

.item_txt h3 {
	padding-left: 27px;
}

.idx_btn li {
	display: inline-block;
	padding: 10px;
	border-radius: 30px;
	text-align: center;
	line-height: 1.4em;
	margin-bottom: 12px;
	color: #2E6089;
	background: #EBF0F4;
	font-size: 16px;
	font-family: 'NotoSansCJKjp-Medium';
	width: 216px
}

.idx_btn li:nth-child(2n) {
	margin-left: 17px
}

.idx_tbl .th {
	color: #fff;
	padding: 15px 20px;
	background: #4C4C4C;
	font-size: 20px;
	font-family: 'NotoSansCJKjp-Medium';
	font-weight: normal;
	letter-spacing: 2px;
}

.idx_tbl th, .idx_tbl td {
	border: 0;

	color: #282828
}

.idx_tbl td {
	font-family: 'NotoSansCJKjp-Regular';
	font-size: 20px;
}

.idx_tbl tr th {
	background: #F3F3F3;
	color: #282828;
	font-family: 'NotoSansCJKjp-Regular';
	font-size: 20px;
	font-weight: normal;
}

.idx_tbl.t01 td, .idx_tbl.t01 th {
	color: #4C4C4C;
	font-family: 'NotoSansCJKjp-Medium';
	padding-left: 20px;
	padding-right: 20px;
}

.idx_tbl.t01 .th {
	color: #fff;
	background: #2e6089;
	text-align: left;
}

.table-lane:nth-child(2) .idx_tbl.t01 .th {
	background: #adadad;
}

.t01:nth-child(2) .th {
	background: #000;
}

.grp_dt01 table:first-child {
	width: 28.5%;
	text-align: left;
	float: left;
}

.table-lane {}

.table-lane:nth-child(2) .idx_tbl.t01 {
	width: 20%;
}

.grp_dt01 {
	display: inline-block;
	width: 100%;
}

.grp_dt01 table:nth-child(3) .th {
	background: #adadad;
}

.price_description dt, .price_description dd {
	float: left;
}

.price_description dl dt {
	width: 80px;
	font-weight: bold;
	color: #2e6089;
}

.price_description dl:nth-child(2) dt {
	color: #428a9b;
}

.price_description dl dt:nth-child(2) {}

.price_description dl dd:before {
	content: "-";
}

.idx_tbl.t01 td, .idx_tbl.t01 th, .grp_dt01 table:first-child th {
	text-align: left;
}

.idx_tbl .row2 {
	position: relative
}

.idx_tbl .row2 span {
	position: absolute;
	left: 20px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 20px;
	font-family: 'NotoSansCJKjp-Medium';
	color: #4C4C4C
}

.grp_dt01 .idx_tbl {
	width: 22%;
	float: left;
}

.grp_dt01 .idx_tbl:nth-child(2) {
	width: 25%;
}

.price_description p {
	margin-bottom: 0;
}

.price_description dl {
	margin: 0;
	display: inline-block;
	width: 100%;
}

.idx_tbl.tblue {
	border: 18px solid #2E6089;
	margin-right: 5px;
}

.idx_tbl.tblue .list01 {
	padding-left: 0;
}

.idx_tbl.tblue .th {
	background: #2E6089
}

.idx_tbl.tblue .th, .idx_tbl.tgreen .th {
	padding: 22px 0 30px 0;
}

.idx_tbl.tgreen {
	border: 18px solid #adadad;
	margin: 0;
	float: left;
}

.idx_tbl.tgreen .th {
	background: #adadad;
}

.idx_tbl.t01 .list01 {
	padding-left: 74px;
	margin-right: -20px;
	position: relative;
	top: 3px;
}

.idx_tbl.t01 .list01 li {
	padding-left: 10px
}

.idx_tbl.tblue td, .idx_tbl.tgreen td {
	text-align: center;
	font-family: 'NotoSansCJKjp-Regular';
	font-size: 20px;
	padding-left: 10px;
	padding-right: 10px;
}

dx_tbl .height_1 {
	height: 127px;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.height_1 .list01 {
	margin: 10px -20px;
}

.height_2 {
	height: 135px
}

.height_6 {
	height: 260px;
	vertical-align: top
}

.height_6 .list_x {
	padding: 8px 0 0 31px;
	letter-spacing: 1px;
}

.height_7 {
	height: 95px;
}

.list01 li {
	display: block;
	padding-bottom: 7px;
	border-bottom: 1px dotted #4C4C4C
}

.list01 li:last-child {
	border-bottom: 0;
	padding-bottom: 0;
	position: relative;
	top: 9px
}

.question {
	position: relative;
	width: 980px;
	margin: 0 auto 30px;
}

.question dt {
	position: relative;
	/*padding: 17px 70px 17px 85px;*/
	padding: 17px 0;
	color: #1e1e1e;
	font-size: 20px;
	font-weight: bold;
	cursor: pointer;
	line-height: 1.9em;
	background: #F3F3F3;
	letter-spacing: 1.5px;
}

/* 20220927 追加 */
.question dt .question-text {
    position: relative;
    padding: 0 70px 0 85px;
}
.question dt .question-text:before, .question dt .question-text:after {
	content: "";
	position: absolute;
	height: 2px;
	width: 20px;
	background: #4C4C4C;
	border-radius: 5px;
	top: 19px;
	right: 35px;
	transition: all 0.5s ease;
	z-index: 1
}
.question dt .question-text:hover:before, .question dt .question-text:hover:after {
	background: #2E6089;
}
.question dt .question-text:before {
	transform: rotate(180deg);
}
.question dt .question-text:after {
	transform: rotate(90deg);
}
.question.active dt .question-text:after {
	display: none;
}
.question.active dt .question-text:before {
	transform: rotate(-180deg);
}
.question dt .question-label {
    padding-left: 40px;
    margin-bottom: 5px;
}
.question dt .question-label span {
    display: inline-block;
    position: static;
    font-family: inherit;
    font-size: 70%;
    font-weight: 400;
    line-height: 1.4;
    color: #fff;
    padding: 3px 20px;
    margin: 0 5px 5px 0;
}
.question dt .question-label span.color1 {
    background: #3465A4;
}
.question dt .question-label span.color2 {
    background: #34A47B;
}
.question dt .question-label span.color3 {
    background: #E3B117;
}
.question dt .question-label span.color4 {
    background: #DB5E5E;
}
.question dt .question-label span.color5 {
    background: #D664B0;
}
.question dt .question-label span.color6 {
    background: #5E6570;
}
.question dt .question-label span.color7 {
    background: #17AFE3;
}
.question dt .question-label span.color8 {
    background: #7E5EDB;
}
.question dt .question-label span.color9 {
    background: #FD8547;
}
.question dt .question-label span.color10 {
    background: #70C73B;
}
.question dt .question-label span.color11 {
    background: #ff00ff;
}
.question dt .question-label span.color12 {
    background: #84919e;
}
.question dt .question-label span.color13 {
    background: #ff4b00;
}
.question dt .question-label span.color14 {
    background: #804000;
}
.question dt .question-label span.color15 {
    background: #03af7a;
}
.question dt .question-label span.color16 {
    background: #005aff;
}
.question dt .question-label span.color17 {
    background: #4dc4ff;
}
.question dt .question-label span.color18 {
    background: #ff8082;
}
.question dt .question-label span.color19 {
    background: #32cd32;
}
.question dt .question-label span.color20 {
    background: #990099;
}

.question dt span {
	font-family: 'Oswald', sans-serif;
	font-weight: 700;
	left: 42px;
	position: absolute;
	/*top: 16px;*/
	top: 0;
	padding-right: 5px;
}

.question dt span:after {
	content: "";
	font-family: 'Oswald', sans-serif;
	font-weight: 700;
	right: -3px;
	bottom: 10px;
	position: absolute;
	border: 2px solid;
	border-radius: 5px
}

.question dd {
	position: relative;
	padding: 20px 35px 26px 38px;
	display: none;
	overflow: hidden;
	border: 1px solid #e6e6e6;
	margin-top: 20px;
	font-size: 18px;
	font-family: 'NotoSansCJKjp-Regular';
}

/*
.question:before, .question:after {
	content: "";
	position: absolute;
	height: 2px;
	width: 20px;
	background: #4C4C4C;
	border-radius: 5px;
	top: 34px;
	right: 35px;
	transition: all 0.5s ease;
	z-index: 1
}

.question:hover:before, .question:hover:after {
	background: #2E6089;
}

.question:before {
	transform: rotate(180deg);
}

.question:after {
	transform: rotate(90deg);
}

.question.active:after {
	display: none;
}

.question.active:before {
	transform: rotate(-180deg);
}
*/

.list-style01 li {
	list-style: disc;
	margin-left: 20px;
}

.list-style01 {
	margin-bottom: 30px;
}

.f_btn {
	display: flex;
	flex-flow: wrap;
	justify-content: space-between;
}

.f_btn li {
	display: inline-block;
	width: 50%;
	align-self: center;
	padding: 59px 85px 46px
}

.f_btn .contact {
	background: #428A9B;
	text-align: right
}

.f_btn .dowload {
	background: #2E6089;
	text-align: left
}

.f_btn a {
	font-size: 24px;
	font-family: 'NotoSansCJKjp-Medium';
	text-decoration: none;
	width: 460px;
	background: #fff;
	display: inline-block;
	text-align: center;
	overflow: hidden;
	position: relative;
	padding: 27px 0;
}

.f_btn a:before, .f_btn a:after {
	content: "";
	position: absolute;
	transition: all 0.4s ease
}

.f_btn .contact a {
	color: #2F797C;
}

.f_btn .dowload a,
.gnavi_pc .dowload a {
	color: #2A5081;
}

.f_btn a span {
	display: inline-block;
	padding: 0 10px 0 42px;
	min-width: 73%;
	width: auto;
	line-height: 1.5em
}

.f_btn a:before {
	width: calc(100% - 12px);
	height: calc(100% - 12px);
	border: 1px solid #2A5081;
	top: 50%;
	transform: translateY(-50%);
	right: 0;
	left: 0;
	margin: 0 auto
}

.f_btn a:after {
	width: 100%;
	height: 100%;
	left: -100%;
	top: 0;
	background: rgba(0, 0, 0, 0.1);
}
.gnavi_pc .contact a,
.gnavi_pc .dowload a,
.gnavi_pc .trial a {
	overflow: hidden;
	background: #25757a;
	display: flex;
	align-items: center;
  min-height: 50px;
	border: 2px solid #25757a;
	color: #fff;
	transition: .5s;
}
@media only screen and (min-width: 641px) {
	.gnavi_pc .contact a,
	.gnavi_pc .dowload a,
	.gnavi_pc .trial a {
		border-radius: 50px;
	}
	.gnavi_pc .contact a,
	.gnavi_pc .trial a {
		margin-left: 10px;
	}
}

.gnavi_pc .contact a span,
.gnavi_pc .dowload a span{
	z-index: 9;
	position: relative;
}
.gnavi_pc .trial a{
	background: #365a89;
	color: white;
	border-color: #365a89;
}
.gnavi_pc .contact a:before,
.gnavi_pc .dowload a:before,
.gnavi_pc .trial a:before{
	display: none;
}
.gnavi_pc .contact a:hover ,
.gnavi_pc .dowload a:hover {
	background: white;
}
.gnavi_pc .contact a:hover span,
.gnavi_pc .dowload a:hover span {
	color: #25757a !important;
}
.gnavi_pc .trial a:hover {
	background: white;
	color: #365a89!important;
}
.f_btn a:hover:after {
	left: 0;
}

.f_btn .contact a:before {
	border: 1px solid #2F797C
}

.f_btn .contact span {
	background: url(/kcc/share/images/ico_email01.png) no-repeat 0 50%;
	background-size: 30px
}

.f_btn .dowload span {
	background: url(/kcc/share/images/ico_dow1.png) no-repeat 0 50%;
	background-size: 33px
}

.cta_btn {
	display: flex;
	flex-flow: wrap;
	justify-content: space-between;
	margin-top: 80px;
}

.cta_btn li {
	display: inline-block;
	width: 50%;
	align-self: center;
	padding: 30px 42px 20px;
}

.cta_btn .contact {
	background: #428A9B;
	text-align: right
}

.cta_btn .dowload {
	background: #2E6089;
	text-align: left
}

.cta_btn a {
	font-size: 24px;
	font-family: 'NotoSansCJKjp-Medium';
	text-decoration: none;
	width: 340px;
	background: #fff;
	display: inline-block;
	text-align: center;
	overflow: hidden;
	position: relative;
	padding: 27px 0;
}

.cta_btn a:before, .cta_btn a:after {
	content: "";
	position: absolute;
	transition: all 0.4s ease
}

.cta_btn .contact a {
	color: #2F797C;
}

.cta_btn .dowload a {
	color: #2A5081;
}

.cta_btn a span {
	display: inline-block;
	padding: 0 10px 0 42px;
	min-width: 73%;
	width: auto;
	line-height: 1.5em;
}

.cta_btn a:before {
	width: calc(100% - 12px);
	height: calc(100% - 12px);
	border: 1px solid #2A5081;
	top: 50%;
	transform: translateY(-50%);
	right: 0;
	left: 0;
	margin: 0 auto
}

.cta_btn a:after {
	width: 100%;
	height: 100%;
	left: -100%;
	top: 0;
	background: rgba(0, 0, 0, 0.1);
}

.cta_btn a:hover:after {
	left: 0;
}

.cta_btn .contact a:before {
	border: 1px solid #2F797C
}

.cta_btn .contact span {
	background: url(/kcc/share/images/ico_email01.png) no-repeat 0 50%;
	background-size: 30px
}

.cta_btn .dowload span {
	background: url(/kcc/share/images/ico_dow1.png) no-repeat 0 50%;
	background-size: 33px
}

.footer-fix {
	width: 100%;
	height: 80px;
	position: fixed;
	bottom: -5px;
	opacity: 0.95;
	z-index: 2;
}

.footer-fix p {
	float: left;
}

#totop {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 3;
	line-height: 0;
	margin: 0;
	display: inline-block;
	width: 6%;
	height: 75px;
	background: #151515;
	transition: 0.2s all;
}

#totop a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

#totop:hover {
	background: #42899B
}

#totop a:hover img {
	opacity: 1
}

p.fix_video {
	position: fixed;
	right: 5px;
	bottom: 5px;
	margin: 0;
	float: none;
	line-height: 0;
	transition: 0.2s all;
	cursor: pointer;
	display: none;
}

.fix_video.scale-down {
	bottom: -220px;
}

p.fix_video span {
	position: absolute;
	background: #0d0d0d;
	display: block;
	padding: 12px 12px;
	color: #fff;
	right: 0;
	margin-top: -23px;
	font-size: 10px;
	border-radius: 2px;
}

p.fix_video:hover {
	opacity: 0.8;
}

p.fix_video a img {
	transition: 0.2s all;
}

.modal {
	display: none;
	position: fixed;
	width: 100%;
	top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.modal__bg {
	background: rgba(53, 53, 53, 0.8);
	position: absolute;
	width: 100%;
	top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.modal__content {
	background: #151515;
	left: 50%;
	padding: 40px;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	border: 1px solid #000;
}

.modal__content p {
	margin: 0 auto;
	text-align: center;
	float: none;
	margin-bottom: 20px;
}
@media only screen and (max-width: 640px) {
	.modal__content iframe {
    width: 90vw;
    height: 51vw;
    display: block;
	}
}

p.js-modal-close {
	display: inline-block;
	text-align: center;
	float: none;
	margin-bottom: 0;
	width: 100%;
}

p.js-modal-close a {
	background: #797979;
	color: #fff;
	border-radius: 3px;
	text-decoration: none;
	font-size: 13px;
	padding: 9px 30px;
	transition: 0.2s all;
}

p.js-modal-close a:hover {
	opacity: 0.8;
}

#footer .box_black {
	margin: 0;
	position: fixed;
	text-align: center;
	width: 100%;
	bottom: 75px;
	padding: 6px;
	display: none;
}

#footer .box_black:after {
	display: none;
}

#footer .box_black span {
	font-size: 12px;
	line-height: 1.5em;
	font-family: 'NotoSansCJKjp-Medium';
	color: #fff;
	letter-spacing: 2px;
}

#footer [class *='btn_'] {
	width: 23.5%;
	margin: 0;
	height: 75px;
	transition: all 0.4s ease;
	-webkit-transition: all 0.4s ease;
}

#footer [class *='btn_'] a {
	display: block;
	height: 100%;
	width: 100%;
	color: #fff;
	font-size: 17px;
	text-decoration: none;
	text-align: center;
	font-family: 'NotoSansCJKjp-Medium';
	padding: 18px 0 15px;
}

#footer .btn_contact {
	background: #428A9C url(/kcc/share/images/ico_email.png) no-repeat left 81px top 18px;
}

#footer .btn_dowload {
	background: #2E6089 url(/kcc/share/images/ico_dow.png) no-repeat left 65px top 25px;
}

#footer .btn_demo {
	background: #b1b1b1 url(/kcc/share/images/ico_mouse.png) no-repeat left 92px top 20px;
}

#footer .btn_trial {
	background: #5a5a5a url(/kcc/share/images/ico_free.png) no-repeat left 70px top 22px;
}

#footer .btn_contact a:before, .btn_dowload a:before, #footer>li:first-child a:before {
	display: none
}

#footer [class *='btn_'] a:hover {
	color: #fff;
}

#footer [class *='btn_']:hover {
	opacity: 0.8;
}

body p.copyright {
	text-align: center;
	line-height: 1.4em;
	padding: 30px 0 20px;
	margin-bottom: 0;
	font-size: 14px;
	color: #4C4C4C;
}


/******************************Footer********************************/


/*******************************************************************/

.container {
	width: 1050px;
	margin: 0 auto;
}


/*===============FIX chome =============*/

@media screen and (-webkit-min-device-pixel-ratio:0) {
	.youtb h2 {
		line-height: 1.1em;
	}
}


/******************************Satori********************************/


/*******************************************************************/


.satori__creative_container {
	margin: 10px;
}

#satori__creative_container .satori__require {
	background: #e02738;
	color: #fff;
	padding: 7px 8px;
	font-size: 13px;
}

#satori__creative_container .satori__btn {
	background-color: #2e6089;
	color: #fff;
	font-size: 15px;
	border-radius: 4px;
	padding: 10px 80px;
	text-align: center;
	margin: 0 auto;
}

#satori__privacy_policy_agreement_wrapper {
	border: 1px solid #d2d2d2;
	border-radius: 3px;
	background: #fff;
	padding: 10px 20px 5px 10px;
	margin: 5px 8px 40px 8px;
}

#satori__creative_container .satori__btn:hover {
	opacity: 0.8;
}

.satori__custom_form_e6808dab0205d1f2_css .satori__input_group label {
	font-size: 13px;
}

.satori__custom_form_e6808dab0205d1f2_css .satori__message {
	font-size: 15px;
}

#satori__creative_container *, #satori__creative_container :after, #satori__creative_container :before, #satori__form_container *, #satori__form_container :after, #satori__form_container :before, #satori__html_part_container *, #satori__html_part_container :after, #satori__html_part_container :before {
	transition: 0.2s all !important;
	font-size: 12px;
	text-align: left;
}

#satori__creative_container .satori__submit_group{
	text-align: center;
}

#satori__creative_container table{
	width: 100% !important;
}

#satori__popup_close{
    background-color: #2a5081 !important;
}

#satori__popup_widget{
	border-top: 5px solid #2a5081 !important;
}


dl.bn_area {
    text-align: center;
    margin-bottom: 80px;
}

dl.bn_area>dt {
    font-size: 36px;
    position: relative;
    margin-bottom: 40px;
    letter-spacing: 0.070em;
}

dl.bn_area>dt span {
    color: #2f797c;
}

dl.bn_area>dt:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    border-bottom: 2px solid #4c4c4c;
    width: 76%;
}
@media only screen and (min-width: 641px) {
	dl.bn_area>dd:last-child {
	    display: flex;
	    justify-content: space-between;
	}
}

dl.bn_area dl {
    max-width: 320px;
    display: flex;
    flex-wrap: wrap;
    align-content: baseline;
    font-size: 16px;
}

dl.bn_area dl dt {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    min-height: 80px;
    width: 100%;
    margin-bottom: 20px;
    font-size: 20px;
    line-height: initial;
}

dl.bn_area dd:last-child a {
    text-decoration: none;
    color: #2f797c;
    line-height: initial;
    display: block;
}
dl.bn_area dl dd.js-modal-open2 {
    line-height: initial;
    color: #2f797c;
	cursor: pointer;
}
dl.bn_area dl dd.js-modal-open2:hover img{
	opacity: .7;
}

dl.bn_area dl dd img {
    margin-bottom: 10px;
	width: 100%;
}
body.index p.fix_video {
    display: none !important;
}



/* 20210608 追加 */

span.mark {background:linear-gradient(transparent 60%, #ff6 60%);}

ol.list-style01 li {
	list-style: decimal;
	margin-left: 20px;
}

.list-normal {
	margin: 0 0 20px 3.5em;
	padding: 0;
}
.list-normal > li {
	margin: 0 0 .5em !important;
	padding: 0 !important;
}
ul.list-normal > li {list-style: disc;}
ol.list-normal > li {list-style: decimal;}


/* 202112 追加 */

.fixed .gnavi-sub_pc {
    display: none;
}

.fixed #header .logo {
    margin: 0 auto 0 0;
}

.fixed #header ul.gnavi_pc {
    margin: 0;
}

.fixed #header {
    padding: 10px 20px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.topics-wrap {
    margin: 0px auto 50px;
    padding: 20px 20px ;
    background: #2e6089;
}
.box08.topics-wrap h2 {
    margin: 0;
    padding-bottom: 20px;
}
.box08.topics-wrap h2 >* {
    color: white;
    margin-bottom: 0;
}

.box08.topics-wrap h2:after {
    display:none;
}
.box08.topics-wrap ul.news-list {
    margin: 0;
}

ul.news-list {
    background: white;
    width: 100%;
}
@media only screen and (max-width: 640px){
.topics-wrap {
    padding: 20px 10px 10px !important;
}
.box08.topics-wrap h2 {
	margin: 0;
}
.box08.topics-wrap ul {
	padding: 10px;
}
}


/* 20220810 追加 */

img {

    height: auto;
}


/* 20220927 追加 Start */
/* マニュアル活用法 一覧 */
.method_list {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.method_list .method_list_item {
    margin-bottom: 55px;
}
.method_list .method_list_item a {
    text-decoration: none;
}
@media only screen and (max-width: 640px){
    .method_list {
        display: block;
    }
    .method_list .box_list_detail.method_list_item {
        width: 100%;
        margin-bottom: 75px;
    }
}

/* マニュアルFAQ 一覧 */
.faq_box {
    padding: 113px 0 88px;
}
.faq_container {
    max-width: 900px;
    margin: 0 auto;
}
.faq_menu {
    display: flex;
    margin: 0 auto 50px;
}
.faq_menu li {
    flex: 1;
}
.faq_menu li a {
    display: block;
    height: 100%;
    font-size: 21px;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    line-height: 1.5;
    color: #2E6089;
    border-bottom: 5px solid #fff;
    padding: 10px;
    margin-bottom: 5px;
}
.faq_menu li a:hover {
    background: #dae3f3;
    border-bottom: 5px solid #2E6089;
    opacity: 1;
}
/*
.faq_menu {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 70px;
}
.faq_menu li {
    flex: 0 0 19%;
    position: relative;
    background: #F1F9F9;
    border: 1px solid #337B81;
    margin: 0 1% 10px 0;
}
.faq_menu li::before {
    content: "";
    display: block;
    position: absolute;
    top: -1px;
    right: -1px;
    height: 0;
    border-top: solid 30px #fff;
    border-left: solid 30px transparent;
    box-shadow: -1px 1px 1px #337b81;
}
.faq_menu li::after {
    content: "";
    display: block;
    position: absolute;
    top: -1px;
    right: -1px;
    height: 0;
    border-bottom: solid 30px #BAE5D4;
    border-right: solid 30px transparent;
}
.faq_menu li a {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    min-height: 130px;
    height: 100%;
    font-family: 'NotoSansCJKjp-Bold';
    font-size: 20px;
    line-height: 1.5;
    text-decoration: none;
	text-align: center;
    color: #337B81;
}
.faq_menu li a:hover {
    color: #006bAF;
}
.faq_menu li a::after {
    content: "";
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    border-top: 10px solid #337B81;
    border-right: 13px solid transparent;
    border-left: 13px solid transparent;
}
*/
.faq_title {
    display: flex;
    align-items: center;
    font-family: 'NotoSansCJKjp-Bold';
    font-size: 30px;
    text-align: center;
    color: #337B81;
    margin-bottom: 60px;
}
.faq_title::before, .faq_title::after {
    content: "";
    flex: 1;
    border-top: 4px solid #337B81;
}
.faq_title::before {
    margin-right: 70px;
}
.faq_title::after {
    margin-left: 70px;
}
.faq_list {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-bottom: 60px;
}
.faq_item {
    flex: 0 0 45%;
    margin-bottom: 40px;
}
.faq_item .title {
    display: flex;
    align-items: center;
    font-size: 22px;
    text-align: left;
    margin-bottom: 25px;
}
.faq_item .title img {
    margin-right: 10px;
}
.faq_item .list li {
    border-bottom: 1px solid #C7C7C7;
}
.faq_item .list li a {
    font-size: 17px;
    text-decoration: none;
}
@media only screen and (max-width: 640px){
    .faq_box {
        padding: 30px 10px 40px;
    }
    .faq_menu {
        display: block;
        margin: 0 auto 50px;
    }
    .faq_menu li a {
        font-size: 17px;
        margin-bottom: 10px;
    }
    /*
    .faq_menu {
        display: block;
        margin-bottom: 50px;
    }
    .faq_menu li::before {
        border-top: solid 20px #fff;
        border-left: solid 20px transparent;
    }
    .faq_menu li::after {
        border-bottom: solid 20px #BAE5D4;
        border-right: solid 20px transparent;
    }
    .faq_menu li a {
        display: block;
        min-height: auto;
        font-size: 16px;
        text-align: left;
        padding: 13px 20px 13px 45px;
    }
    .faq_menu li a::after {
        bottom: 50%;
        left: 15px;
        transform: translateY(50%);
        border-top: 8px solid #337B81;
        border-right: 10px solid transparent;
        border-left: 10px solid transparent;
    }
    .faq_menu .pc {
        display: none;
    }
    */
    .faq_list {
        display: block;
    }
    .faq_title {
        font-size: 19px;
        margin-bottom: 40px;
    }
    .faq_title::before {
        margin-right: 30px;
    }
    .faq_title::after {
        margin-left: 30px;
    }
    .faq_item .title img {
        max-width: 38px;
    }
}

/* マニュアルFAQ 詳細 */
.faq_detail_container {
    display: flex;
    max-width: 1200px;
    margin: 0 auto;
}
.faq_detail_container .menu-btn, .faq_detail_container .close-btn  {
    display: none;
}
.faq_detail_content {
    flex: 1;
    border-top: 1px solid #979797;
    padding-top: 45px;
}
.faq_detail_content .faq-h1 {
    font-family: 'NotoSansCJKjp-Bold';
    font-size: 36px;
    letter-spacing: 0.06em;
    line-height: 1.5;
    text-align: center;
    color: #3D8793;
    margin: 0px 0 40px;
}
.faq_detail_content .faq-h2 {
    font-family: 'NotoSansCJKjp-Medium';
    font-size: 24px;
    letter-spacing: 0.06em;
    color: #2A5081;
    background: url(/kcc/share/images/icon_04.jpg) left center /50px no-repeat;
    padding: 7px 0 10px 55px;
    margin: 0 0 30px 0;
}
.faq_detail_content .faq-h3 {
    font-family: 'NotoSansCJKjp-Regular';
    font-size: 20px;
    font-weight: bold;
    line-height: 1.2;
    text-align: left;
    letter-spacing: 0;
    color: #4a8f9b;
    border-left: 5px solid #4a8f9b;
    padding: 5px 0 5px 15px;
    margin: 50px 0 30px 0;
}
.faq_detail_content .strong {
    background: linear-gradient(transparent 50%, #BDEEF1 60%);
}
.faq_detail_content small {
    line-height: 1.2;
}
.faq_detail_content a {
    color: #337B81;
}
.faq_detail_content a:hover {
    color: #1f2674;
}
.faq_detail_content .link-arrow {
    text-decoration: none;
}
.faq_detail_content .link-arrow::before {
    content: url("../images/icon_arrow01.png");
    margin-right: 5px;
}
.faq_detail_content ul li {
    position: relative;
    padding-left: 1em;
}
.faq_detail_content ul li::after {
    content: "";
    position: absolute;
    top: 0.7em;
    left: 0;
    transform: rotateZ(45deg);
    width: 8px;
    height: 8px;
    background: #41628E;
}
.faq_detail_content ol {
    counter-reset: item;
}
.faq_detail_content ol li {
    position: relative;
    padding-left: 1.2em;
}
.faq_detail_content ol li::after {
    counter-increment: item;
    content: counter(item) ".";
    position: absolute;
    top: 0;
    left: 0;
    color: #41628E;
}
.faq_detail_content .imgtext1 {
    margin-bottom: 80px;
}
.faq_detail_content .imgtext1 .image {
    text-align: center;
    margin-bottom: 20px;
}
.faq_detail_content .imgtext2 {
    display: flex;
    justify-content: space-between;
    margin-bottom: 80px;
}
.faq_detail_content .imgtext2 .item {
    flex: 0 0 49%;
    max-width: 420px;
}
.faq_detail_content .imgtext2 .image {
    text-align: center;
    margin-bottom: 20px;
}
.faq_detail_content .imgtext2 .title {
    font-family: 'NotoSansCJKjp-Bold';
    font-size: 19px;
    text-align: center;
    color: #41628E;
    margin-bottom: 20px;
}
.faq_detail_content .imgflex {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 60px;
}
.faq_detail_content .imgflex .item {
    flex: 0 0 32%;
    margin: 0 2% 15px 0;
}
.faq_detail_content .imgflex .item:nth-child(3n) {
    margin-right: 0;
}
.faq_detail_content .imgtext3 {
    margin-bottom: 20px;
}
.faq_detail_content .imgtext3::after {
    content: "";
    clear: both;
    display: block;
}
.faq_detail_content .imgtext3 .image {
    max-width: 175px;
    float: left;
    margin-right: 40px;
}
.faq_detail_content .imgtext3 .title {
    font-family: 'NotoSansCJKjp-Bold';
    font-size: 22px;
    text-align: left;
    color: #41628E;
    margin-bottom: 10px;
}
.faq_detail_content .textbox {
    background: #EFEFEF;
    padding: 45px 40px 60px;
    margin-bottom: 60px;
}
.faq_detail_content .textbox p {
    text-align: center;
}
.faq_detail_content .textbox .btn {
    margin-top: 40px;
}
.faq_detail_content .textbox .dl_link {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 250px;
    height: 55px;
    font-family: 'NotoSansCJKjp-Bold';
    font-size: 18px;
    text-decoration: none;
    color: #fff;
    background: #41628E;
    margin: 0 auto;
}
.faq_detail_content .textbox .dl_link:hover {
    opacity: .7;
}
.faq_detail_content .faq-table tr {
    border-bottom: 1px solid #D7D7D7;
}
.faq_detail_content .faq-table th {
    width: 16%;
    font-size: 16px;
    vertical-align: middle;
    text-align: left;
    color: #282828;
    background: none;
    border: none;
    padding-right: 10px;
}
.faq_detail_content .faq-table td {
    border: none;
}
.faq_detail_content .movie {
    position: relative;
    padding-top: 56%;
    margin: 0 auto;
}
.faq_detail_content .movie iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.faq_detail_footer {
    border-top: 1px solid #D7D7D7;
    border-bottom: 1px solid #D7D7D7;
    padding: 65px 0 80px;
    margin-top: 55px;
}
.faq_detail_footer .title {
    font-family: 'NotoSansCJKjp-Bold';
    text-align: center;
    margin-bottom: 30px;
}
.faq_detail_footer .btn {
    display: flex;
    justify-content: center;
}
.faq_detail_footer .btn div:first-child {
    margin-right: 50px;
}
.faq_detail_footer .link-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 110px;
    height: 45px;
    font-family: 'NotoSansCJKjp-Bold';
    font-size: 19px;
    text-decoration: none;
}
.faq_detail_footer .link-btn.yes {
    color: #fff;
    background: #03A7B4;
}
.faq_detail_footer .link-btn.yes:hover {
    color: #006baf;
}
.faq_detail_footer .link-btn.no {
    color: #282828;
    background: #D8D8D8;
}
.faq_detail_footer .link-btn.no:hover {
    color: #006baf;
}
.faq_detail_footer .link-btn img {
    margin-right: 8px;
}
.faq_detail_sidebar {
    flex: 0 0 260px;
    margin-left: 60px;
}
.faq_detail_sidebar_list {
    margin-bottom: 55px;
}
.faq_detail_sidebar_list:first-child {
    border-top: 1px solid #C7C7C7;
}
.faq_detail_sidebar_list li {
    text-align: center;
    padding: 10px 0;
    border-bottom: 1px solid #C7C7C7;
}
.faq_detail_sidebar_list a {
    font-family: 'NotoSansCJKjp-Bold';
    text-decoration: none;
    color: #337B81;
}
.faq_detail_sidebar_list a:hover {
    color: #006baf;
}
.faq_detail_sidebar_title {
    position: relative;
    font-family: 'NotoSansCJKjp-Bold';
    font-size: 19px;
    text-align: center;
    color: #337B81;
    background: #F1F9F9;
    border: 1px solid #337B81;
    padding: 17px 0;
    margin-bottom: 0;
}
.faq_detail_sidebar_title::before {
    content: "";
    display: block;
    position: absolute;
    top: -1px;
    right: -2px;
    z-index: 2;
    height: 0;
    border-top: solid 20px #fff;
    border-left: solid 20px transparent;
}
.faq_detail_sidebar_title::after {
    content: "";
    display: block;
    position: absolute;
    top: -1px;
    right: -1px;
    height: 0;
    border-top: solid 20px #337B81;
    border-left: solid 20px transparent;
}
@media only screen and (max-width: 640px){
    .faq_detail_container {
        display: block;
    }
    .faq_detail_container .menu-btn {
        display: flex;
        justify-content: center;
        align-items: center;
        position: fixed;
        bottom: 60px;
        right: 10px;
        z-index: 1;
        width: 60px;
        height: 60px;
        background: #337B81;
        border-radius: 50%;
        cursor: pointer;
    }
    .faq_detail_container .menu-btn .btn {
        display: block;
        position: relative;
        width: 25px;
        height: 18px;
    }
    .faq_detail_container .menu-btn .btn span {
        position: absolute;
        left: 0;
        width: 100%;
        height: 2px;
        background: #fff;
    }
    .faq_detail_container .menu-btn .btn span:nth-child(1) {
        top: 0;
    }
    .faq_detail_container .menu-btn .btn span:nth-child(2) {
        top: 8px;
        width: 60%;
    }
    .faq_detail_container .menu-btn .btn span:nth-child(3) {
        bottom: 0;
    }
    .faq_detail_container .close-btn {
        display: block;
        padding-top: 20px;
    }
    .faq_detail_container .close-btn .btn {
        display: block;
        position: relative;
        width: 60px;
        height: 60px;
        border: 1px solid #fff;
        border-radius: 50%;
        margin-left: auto;
        cursor: pointer;
    }
    .faq_detail_container .close-btn .btn::before, .faq_detail_container .close-btn .btn::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        width: 25px;
        height: 2px;
        background: #fff;
    }
    .faq_detail_container .close-btn .btn::before {
        transform: translate(-50%,-50%) rotateZ(45deg);
    }
    .faq_detail_container .close-btn .btn::after {
        transform: translate(-50%,-50%) rotateZ(-45deg);
    }
    .faq_detail_content .faq-h1 {
        font-size: 20px;
        margin: 0px 0 35px;
        line-height: 1.3em;
    }
    .faq_detail_content .faq-h2 {
        font-size: 16px;
        background-size: 35px;
        padding: 7px 0 10px 40px;
    }
    .faq_detail_content .faq-h3 {
        font-size: 20px;
        margin: 50px 0 30px 0;
        line-height: 1.2;
    }
    .faq_detail_content .imgtext2 {
        display: block;
        margin-bottom: 20px;
    }
    .faq_detail_content .imgtext2 .item {
        margin-bottom: 60px;
    }
    .faq_detail_content .imgtext2 .title {
        font-family: 'NotoSansCJKjp-Bold';
        font-size: 16px;
    }
    .faq_detail_content .imgflex {
        justify-content: space-between;
    }
    .faq_detail_content .imgflex .item {
        flex: 0 0 48.5%;
        margin: 0 0 10px;
    }
    .faq_detail_content .imgtext3 .image {
        max-width: 70px;
        margin-right: 20px;
    }
    .faq_detail_content .imgtext3 .title {
        font-size: 16px;
    }
    .faq_detail_content .textbox {
        background: #EFEFEF;
        padding: 30px 15px 40px;
    }
    .faq_detail_content .textbox .dl_link {
        max-width: 200px;
    }
    .faq_detail_content .faq-table th {
        width: 20%;
        font-size: 15px;
    }
    .faq_detail_footer {
        padding: 40px 0 55px;
        margin-top: 40px;
    }
    .faq_detail_footer .link-btn {
        width: 100px;
        height: 40px;
        font-size: 15px;
    }
    .faq_detail_sidebar {
        position: fixed;
        top: 0;
        right: 0;
        transform: translateX(330px);
        z-index: 100;
        width: 330px;
        height: 100%;
        background: #337B81;
        padding: 70px 35px 50px;
        margin-left: 0;
        transition: .3s;
        overflow-y: auto;
    }
    .faq_detail_sidebar.open {
        transform: translateX(0);
    }
    .faq_detail_sidebar_list {
        margin-bottom: 25px;
    }
    .faq_detail_sidebar_list:first-child {
        border-top: 1px solid #fff;
    }
    .faq_detail_sidebar_list li {
        text-align: left;
        border-bottom: 1px solid #fff;
    }
    .faq_detail_sidebar_list a {
        font-family: 'NotoSansCJKjp-Bold';
        color: #fff;
    }
    .faq_detail_sidebar_title {
        font-size: 16px;
        color: #fff;
        background: #337B81;
        border: 1px solid #fff;
        padding: 14px 0;
        margin-bottom: 10px;
    }
    .faq_detail_sidebar_title::before {
        border-top: solid 20px #337B81;
    }
    .faq_detail_sidebar_title::after {
        border-top: solid 20px #fff;
    }
}
/* 20220927 追加 End */


/* 20220508 トライアルフォーム -start- */

@media only screen and (min-width: 641px) {

.trial_pc {display: inline;}
.trial_sp {display: none;}
.trial_main {
    background: #f0f5fa;
    padding: 30px 0;
}
.trial_main > .text {
    color: #2e6089;
    font-size: 2.4rem;
    font-size: 24px;
    font-weight: bold;
    letter-spacing: 5px;
    text-align: center;
}
.trial_main > .step {margin: 30px 0 10px;}
.trial_main > .step, .trial_main > .step_text {
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    display: -webkit-flex; /* Safari */
    justify-content: center;
}
.trial_main > .step > div {align-self: center;}
.trial_main > .step > div:nth-child(odd),
.trial_main > .step_text > div:nth-child(odd) {
    width:150px;
    color: #307c81;
}
.trial_main > .step_text > div > span {font-size: .85em;}
.trial_main > .step > div:nth-child(even),
.trial_main > .step_text > div:nth-child(even) {width: 64px;}
.trial_main > .step_text > div {
    color: #307c81 !important;
    font-size: 1.6rem;
    font-size: 16px;
    line-height: 1.4em;
    margin: 0 0 5px !important;
}
.trial_main > .step > div.arrow:before {
    content: '\025b6';
    color: #646464;
    font-size: 2.0rem;
}

#form {
    padding: 40px 0 60px;
}
.trial_cont {
    width: 980px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    box-sizing: border-box;
}
.trial_cont > div {}
.trial_cont > div:first-child {width: 45%;}
.trial_cont > div:last-child {width: 50%;}
.trial_cont > div > h3 {
    color: #2e6089;
    font-size: 1.8rem;
    font-size: 18px;
    margin-bottom: 10px;
}
.trial_cont > div > .cando_head {
    background: #2e6089;
    color: #fff;
    font-size: 1.8rem;
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 2px;
    text-align: center;
    padding: 20px;
    border-radius: 20px 20px 0 0;
}
.trial_cont > div > .cando_head span {color: #fbdc10;}
.trial_cont > div > .cando {
    padding: 20px;
    border-width: 0 1px 1px;
    border-style: solid;
    border-color: #2e6089;
    border-radius: 0 0 20px 20px;
}
.trial_cont > div > .cando > div {
    min-height: 60px;
    background-position: 0 0;
    background-size: 56px;
    background-repeat: no-repeat;
    color: #2e6089;
    font-size: 1.6rem;
    font-size: 16px;
    margin-bottom: 20px;
    padding: 0 0 0 70px;
}
.trial_cont > div > .cando > div:last-child {margin-bottom: 0;}
.trial_cont > div > .cando > div p {
    line-height: 1.5em;
    margin: 0;
}
.trial_cont > div > .cando > div p:first-child {
    font-size: 1.6rem;
    font-size: 16px;
    font-weight: bold;
}
.trial_cont > div > .cando > div p:last-child {
    font-size: 1.8rem;
    font-size: 18px;
}
.trial_cont > div > .cando > div p:last-child span {border-bottom: 4px solid #fbdc10;}
.trial_cont > div > .cando > div.write {background-image: url(/kcc/share/images/trial_i_write.webp)}
.trial_cont > div > .cando > div.group {background-image: url(/kcc/share/images/trial_i_group.webp)}
.trial_cont > div > .cando > div.search {background-image: url(/kcc/share/images/trial_i_search.webp)}
.trial_cont > div > .cando > div.review {background-image: url(/kcc/share/images/trial_i_review.webp)}
.trial_cont > div > .cando > div.comment {background-image: url(/kcc/share/images/trial_i_comment.webp)}

.trial_info {
    background: url(/kcc/share/images/trial_arrow.webp) center 30px no-repeat;
    background-size: 50%;
    padding: 100px 0 0;
}
.trial_info > ul {
    text-align: center;
    margin: 0;
    padding: 0;
    overflow: hidden;
}
.trial_info > ul > li {
    line-height: 1.4em;
    margin: 0;
    padding: 5px 0;
}
.trial_info > ul > li > strong {color: #2e6089;}
.trial_info > ul > li:nth-child(even):before{
    content: '●';
    color: #fbdc10;
}
.trial_info > ul > li:last-child:before { content: none;}

.trial_thanks {
    height: 360px;
    background: url(/kcc/share/images/trial_thanks.webp) center center no-repeat;
    background-size: contain;
    text-align: center;
    margin-top: 20px;
    padding: 0;
}
.trial_thanks img {width: 80%;}

}

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

.trial_pc {display: none;}
.trial_sp {display: inline;}

.trial_main {
    background: #f0f5fa;
    padding: 2em 0;
}
.trial_main > .text {
    color: #2e6089;
    font-size: 2.4rem;
    font-size: 24px;
    font-weight: bold;
    letter-spacing: 2px;
    text-align: center;
}
.trial_main > .step {margin: 30px 0 10px;}
.trial_main > .step, .trial_main > .step_text {
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    display: -webkit-flex; /* Safari */
    justify-content: center;
}
.trial_main > .step > div {align-self: center;}
.trial_main > .step > div:nth-child(odd),
.trial_main > .step_text > div:nth-child(odd) {
    width:25%;
    color: #307c81;
}
.trial_main > .step_text > div > span {font-size: .9em;}
.trial_main > .step > div:nth-child(even),
.trial_main > .step_text > div:nth-child(even) {width: 10%;}
.trial_main > .step_text > div {
    color: #307c81 !important;
    font-size: 1.4rem;
    font-size: 14px;
    line-height: 1.4em;
    margin: 0 0 5px !important;
}
.trial_main > .step > div.arrow:before {
    content: '\025b6';
    color: #646464;
    font-size: 2.0rem;
}

#form {padding: 2em 0 3em;}
.trial_cont {
    width: 100%;
    margin: 0 auto;
    padding: 0 1em;
    box-sizing: border-box;
}
.trial_cont > div {}
.trial_cont > div > h3 {
    color: #2e6089;
    font-size: 1.8rem;
    font-size: 18px;
    margin-bottom: 1em;
}
.trial_cont > div > .cando_head {
    background: #2e6089;
    color: #fff;
    font-size: 1.8rem;
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 2px;
    text-align: center;
    padding: 1em;
    border-radius: 1em 1em 0 0;
}
.trial_cont > div > .cando_head span {color: #fbdc10;}
.trial_cont > div > .cando {
    padding: 1.5em;
    border-width: 0 1px 1px;
    border-style: solid;
    border-color: #2e6089;
    border-radius: 0 0 1em 1em;
}
.trial_cont > div > .cando > div {
    min-height: 3em;
    background-position: 0 0;
    background-size: 3em;
    background-repeat: no-repeat;
    color: #2e6089;
    font-size: 1.6rem;
    font-size: 16px;
    margin-bottom: 1em;
    padding: 0 0 0 4em;
}
.trial_cont > div > .cando > div:last-child {margin-bottom: 0;}
.trial_cont > div > .cando > div p {
    line-height: 1.4em;
    margin: 0;
}
.trial_cont > div > .cando > div p:first-child {
    font-size: 1.4rem;
    font-size: 14px;
    font-weight: bold;
}
.trial_cont > div > .cando > div p:last-child {
    font-size: 1.6rem;
    font-size: 16px;
}
.trial_cont > div > .cando > div p:last-child span {border-bottom: 4px solid #fbdc10;}
.trial_cont > div > .cando > div.write {background-image: url(/kcc/share/images/trial_i_write.webp)}
.trial_cont > div > .cando > div.group {background-image: url(/kcc/share/images/trial_i_group.webp)}
.trial_cont > div > .cando > div.search {background-image: url(/kcc/share/images/trial_i_search.webp)}
.trial_cont > div > .cando > div.review {background-image: url(/kcc/share/images/trial_i_review.webp)}
.trial_cont > div > .cando > div.comment {background-image: url(/kcc/share/images/trial_i_comment.webp)}

.trial_info {
    background: url(/kcc/share/images/trial_arrow.webp) center 2em no-repeat;
    background-size: 50%;
    margin-bottom: 3em;
    padding: 7em 0 3em;
    border-bottom: 2px dotted #ccc;
}
.trial_info > ul {
    text-align: center;
    margin: 0;
    padding: 0;
    overflow: hidden;
}
.trial_info > ul > li {
    font-size: 1.6rem;
    font-size: 16px;
    line-height: 1.4em;
    margin: 0;
    padding: .2em 0;
}
.trial_info > ul > li > strong {color: #2e6089;}
.trial_info > ul > li:nth-child(even):before{
    content: '●';
    color: #fbdc10;
}
.trial_info > ul > li:last-child:before { content: none;}

.trial_thanks {display: none;}


}


/* 20220508 -end- */