@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@700&display=swap');

/*----------------------------------------------
	c_input
---------------------------------------------*/
.c_input {
	width: 100%;
	height: 50px;
	padding: 13px 20px;
	border: none;
	border-radius: 3px;
	font-size: 2rem;
}

/*----------------------------------------------
	btn
---------------------------------------------*/
.c_btn {
	display: inline-block;
	border: none;
	border: 1px solid transparent;
	background: #F5A530;
	color: #fff;
	font-weight: bold;
	cursor: pointer;
	transition: 0.3s;
	text-decoration: none;
	text-align: center;
}

/*  TYPE
------------------------------------- */
.c_btn.is_login {
	width: 100%;
	padding: 15px;
	font-size: 20px;
	font-size: 2rem;
	border-radius: calc(62px / 2);
}

.c_btn.is_back {
	width: 250px;
	padding: 15px 0;
	background: #1d2088;
	font-size: 1.6rem;
}

.c_btn.is_logout {
	width: 170px;
	background: #fff;
	color: #163F82;
	font-size: 1.6rem;
	text-align: center;
	flex-shrink: 0;
	position: relative;
	z-index: 100;
	display: inline-flex;
	justify-content: center;
	align-content: center;
	max-height: 40px;
	height: 9vw;
	border-radius: 20px;
}

.c_btn.is_view {
	width: 300px;
	padding: 20px 0;
	background: #1d2088;
	font-size: 2rem;
}

.c_btn.is_close {
	max-width: 300px;
	background: #639EF5;
	margin: 20px auto 0;
	text-align: center;
	width: 90vw;
	padding: 15px;
	padding-right: 30px;
	font-size: 20px;
	font-size: 2rem;
	border-radius: calc(62px / 2);
	position: relative;
}

.c_btn.is_close::after{
	content: "";
	background: url(../images/icon_close.png) no-repeat;
	width: 25px;
	height: 25px;
	background-size: contain;
	display: block;
	position: absolute;
	top: calc(50% - (25px / 2));
	right: 95px;
}

.c_btn.is_back{
	background: #639EF5;
	padding: 9px;
	font-size: 1.6rem;
	max-width: 300px;
	width: 100%;
	border-radius: calc(52px / 2);
	margin: 0 auto;
	position: relative;
}

.c_btn.is_back::before{
	content:"";
	background: url(../images/icon_back.png) no-repeat;
	background-size: contain;
	width: 35px;
	height: 35px;
	position: absolute;
	left: 5px;
	top: calc(50% - (35px / 2));
}


.c_btn.is_ippan{
	max-width: 1000px;
	width: 100%;
	background: url(../images/btn_bg.png) no-repeat #5296fb;
	background-size: cover;
	background-position-x: 90%;
	font-family: 'Noto Serif JP', serif;
	padding: 50px 0;
	font-size: 3rem;
	font-weight: bold;
	border-radius: 7px;
	text-shadow: 0 0 5px #163F82;
	box-shadow: 0 0 5px 0 #163F8220;
}

.c_btn.is_shitei{
	max-width: calc(100% / 3 - 15px);
	width: 100%;
	background: #5296fb;
	font-family: 'Noto Serif JP', serif;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	font-size: 2.3rem;
	font-weight: bold;
	border-radius: 7px;
	text-shadow: 0 0 5px #163F82;
	height: 135px;
	box-shadow: 0 0 5px 0 #163F8220;
}

@media screen and (max-width:640px) {
	.c_btn.is_shitei{
		max-width: unset;
		width: 100%;
	}
	.c_btn.is_shitei:not(:last-of-type){
		margin-bottom: 20px;
	}
}



.c_btn.is_pagetop{
	width: 60px;
	height: 60px;
	border-radius: 30px;
	box-shadow: none;
}

.c_btn.is_pagetop::before {
    display: inline-block;
    position: absolute;
    top: calc(50% - (30px/2));
    right: calc(50% - (26px/ 2));
    width: 0;
    height: 0;
    border-width: 0 13px 24px 13px;
    border-style: solid;
    border-color: transparent transparent #fff transparent;
    content: "";
}

.c_btn.is_select{
	background: #639EF5;
	padding: 13px;
	font-size: 1.6rem;
	max-width: 300px;
	width: 100%;
	border-radius: calc(52px / 2);
	margin: 0 auto;
}

.c_btn.is_answer{
	content: "";
	background: url(../images/icon_answer.png) no-repeat;
	width: 99px;
	height: 45px;
	background-size: contain;
	transition: 0.3s;
	flex-shrink: 0;
}

/* .c_btn.is_answer::after {
	content: "";
	background: url(../images/icon_answer.png) no-repeat;
	width: 99px;
	height: 45px;
	position: absolute;
	transition: 0.3s;
} */

.c_btn.is_send_q{
	max-width: 140px;
	width: 100%;
	border-radius: 5px;
	font-size: 1.5rem;
	background: #528ce4;
	padding: 3px;
}

.c_btn.is_send_a{
	max-width: 150px;
	width: 100%;
	border-radius: 5px;
	font-size: 1.5rem;
	background: #F5A530;
	padding: 3px;
}



@media screen and (max-width: 750px) {
	.c_btn.is_send_q {
		padding: 5px 0;
		font-size: 1.4rem;
	}
	.c_btn.is_send_a {
		padding: 5px 0;
		max-width: 100%;
		font-size: 1.4rem;
	}
	.c_btn.is_close {
	margin: 10px auto 0;
	max-width: 90vw;
	width: 100%;
	padding: 10px;
	padding-right: 20px;
	font-size: 1.4rem;
}
.c_btn.is_answer{
	content: "";
	width: calc(99px * 0.8);
	height: calc(45px * 0.8);
}
}


/*  HOVER
------------------------------------- */
.c_btn:hover {
	background: #fac679;
}

.c_btn.is_logout:hover {
	background: rgba(255, 255, 255, 0.596);
}

.c_btn.is_answer:hover::after {
	opacity: 0.6;
}

.c_btn.is_answer:hover{
	background: url(../images/icon_answer.png) no-repeat;
	background-size: contain;
	opacity: 0.6;
}

.c_btn.is_send_q:hover{
	background: #86b7ff;
}

.c_btn.is_ippan:hover,
.c_btn.is_shitei:hover{
	opacity: 0.7;
	background-color: #5296fb;
}

.c_btn.is_ippan:hover{
	background: url(../images/btn_bg.png) no-repeat #5296fb;
	background-size: cover;
	background-position-x: 90%;
}

/*  DISABLED
------------------------------------- */
.c_btn.is_disabled {
	background: rgb(197, 197, 197);
	cursor: auto;
	color: #fff;
	text-shadow: none;
	box-shadow: none;
}

.c_btn.is_disabled:hover {
	background: rgb(197, 197, 197);
	cursor: auto;
	color: #fff;
	border: 1px solid rgb(197, 197, 197);
	opacity: 1;
}

/*  ACCESSORY
------------------------------------- */
.c_triangle { position: relative; }

.c_triangle::before {
	display: inline-block;
	position: absolute;
	top: calc(50% - (12px / 2));
	left: 20px;
	z-index: 999;
	width: 0;
	height: 0;
	border-width: 5px 6px 5px 0;
	border-style: solid;
	border-color: transparent #fff transparent transparent;
	content: "";
}

.c_triangle:hover::before {
	border-color: transparent #004ea2 transparent transparent;
}


/*----------------------------------------------
	c_list_type01
---------------------------------------------*/
.c_list_type01 li {
	margin-bottom: 5px;
	font-weight: bold;
	font-size: 1.8rem;
}

#top .c_list_type01 li {
	font-weight: normal;
}

.c_list_type01 li::before {
	display: inline-block;
	position: relative;
	top: -3px;
	width: 5px;
	height: 5px;
	margin-right: 10px;
	border-radius: 50%;
	background: #000;
	content: "";
}

.c_list_type01.is_red li::before {
	background: #f00;
}

#top .c_list_type01 li {
	padding-left: 1.4rem;
	font-size: 1.4rem;
	text-indent: -1.4rem;
}

.c_list_type01 .c_ses {
	display: inline-block;
	width: 50px;
}

.c_list_type01 .c_ttl {
	display: inline-block;
	width: 450px;
}

/*----------------------------------------------
	c_browser
---------------------------------------------*/
.c_browser_header {
	/* padding: 15px 0;
	background-image: repeating-linear-gradient(-1deg, transparent, transparent, transparent, transparent, transparent), repeating-linear-gradient(89deg, transparent, transparent, transparent, transparent, transparent), repeating-linear-gradient(179deg, transparent, transparent, transparent, transparent, transparent), repeating-linear-gradient(269deg, #c3dbf6, #c3dbf6 5px, transparent 5px, transparent 10px, #c3dbf6 10px);
	background-position: 0 0, 0 0, 100% 0, 0 100%;
	background-size: 2px 100%, 100% 2px, 2px 100% , 100% 2px;
	background-repeat: no-repeat;
	color: #004ea2;
	font-weight: bold;
	font-size: 18px;
	font-size: 1.8rem;
	text-align: center; */
	max-width: 100px;
	width: 23%;
	margin: 20px 100px;
}

.c_browser_inner {
	margin: 30px auto;
	color: #fff;
	max-width: calc(100% - 100px);
}

.c_border{
	background: #fff;
	height: calc(182px - 60px);
	width: 1px;
	display: block;
}

.c_browser_name {
	margin-bottom: 5px;
	font-size: 1.8rem;
	font-weight: bold;
}

@media screen and (max-width: 940px) {
  .c_border{
		display: none;
	}
}

/*----------------------------------------------
	c_contact
---------------------------------------------*/
.c_contact_type02 { font-size: 1.4rem; }

.c_contact_type02 .c_contact_header {
	position: relative;
	padding: 3px 0 3px 8px;
	color: #ffffff;
	font-weight: bold;
	font-size: 1.5rem;
	line-height: 1;
	border-left: 3px solid #ffffff;
}

.c_contact_type02 .c_contact_header::before {
	display: inline-block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 2px;
	width: 1px;
	height: 20px;
	margin: auto 0;
	background: #ffffff;
	content: '';
}

.c_contact_type02 .c_contact_details { line-height: 1.5; }




/*----------------------------------------------
	c_tab
---------------------------------------------*/
.c_tab {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	position: relative;
	width: calc(100% - (20px * 2));
	padding: 20px 0 20px;
	border-radius: 3px 3px 0 0;
	background: #fff;
	color: #2d8cc7;
	font-weight: bold;
	font-size: 2rem;
	text-decoration: none!important;
	text-align: center;
}

.c_tab::after {
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 13px;
	background: rgb(0,87,161);
	background: linear-gradient(180deg, #ffffff 0%, #c8ced12c 100%);
	content: "";
}

.c_tab:not(:last-of-type) { margin-right: 20px; }

.c_tab.is_active,
.c_tab:hover
 {
	background: #2d8cc7;
	color: #fff;
}

.c_tab.is_active::after,
.c_tab:hover::after
 {content: none;}

/*----------------------------------------------
	c_ttl
---------------------------------------------*/
/*  TYPE01
------------------------------------- */
.c_ttl_type01 {
	color: #163F82;
	font-weight: bold;
	font-size: 2.6rem;
	text-align: center;
	position: relative;
	font-family: 'Noto Serif JP', serif;
	padding-bottom: 20px;
}

.c_ttl_type01::after{
	content: "";
	width: 50px;
	height: 1px;
	position: absolute;
	display: block;
	background: #163F82;
	right: 0;
	left: 0;
	margin: 20px auto 0;
}


/*  TYPE02
------------------------------------- */
.c_ttl_type02 {
	color: #163F82;
	font-weight: bold;
	font-size: 3rem;
	text-align: center;
	position: relative;
	font-family: 'Noto Serif JP', serif;
}
/* .inner .c_ttl_type02 {
  padding-bottom: 5px;
  font-size: 3rem;
}
#meeting .c_ttl_type02 a {
  color: #fff;
}
#meeting .c_ttl_type02 a:hover {
  color: #fe8600;
}
.c_ttl_type02.is_blue02 {
  background-color: #004ea2;
}

.c_ttl_type02::before {
  margin: 0 10px;
  line-height: 34px;
  vertical-align: top;
  content: url(../images/arrow_h2.png);
}
/* .c_ttl_type02::after {
  content: "";
  background-color: #1d2088;
  width: 20px;
  height: 100%;
  position: absolute;
  right: -10px;
  top: 0;
  transform: skewx(-20deg);
	z-index: -1;
} */
.c_ttl_type02.is_blue02::after {
  background-color: #004ea2;
}



/*----------------------------------------------
	program accessory
---------------------------------------------*/

.c_number{
	max-width: 75px;
	width: 20%;
	background: #DDE7F5;
	color: #163F82;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	margin-right: 20px;
	min-height: 30px;
	font-weight: bold;
	/* flex-shrink: 0; */
}

.c_ttl{
	font-size: 1.6rem;
	font-weight: bold;
	margin-bottom: 7px;
}

.c_name,
.c_aff{
	font-size: 1.5rem;
	display: inline-block;
}

.c_name{ width: 140px; }

.c_aff{
	max-width: 600px;
	width: 100%;
}

/* 名前が長い時はc_nameとc_affに .is_longをつける */
.c_name.is_long { width: auto }
.c_aff.is_long { padding-left: 110px; }

@media screen and (max-width: 788px) {
	.c_aff.is_long { padding-left: 0; }
}

.c_icon_video{
	display: inline-flex;
  align-items: center;

	max-width: 60px;
	margin-left: auto;
	transition: 0.3s;
}

.c_icon_video *{
	border: none;
	background: none;
	cursor: pointer;
}

.c_icon_video:hover{
	opacity: 0.6;
}

.c_icon_video.is_unregistered{
	position: relative;
}

.c_icon_video.is_unregistered::after{
	content: "未登録";
	position: absolute;
	background: #df311a;
	color: #fff;
	display: block;
	font-size: 1.4rem;
	text-align: center;
	font-weight: bold;
	padding: 3px 5px;
	right: 0;
	left: 0;
	margin: 0 auto;
}

.c_icon_video.is_unregistered:hover{
	opacity: 1;
}

/*----------------------------------------------
　chat
---------------------------------------------*/
.c_chat_ttl{
	background: #163F82;
	font-size: 1.3rem;
	padding: 5px;
	color: #fff;
	font-weight: bold;
}

.c_chatname{
	display: inline-block;
	margin-right: 5px;
	font-size: 1.3rem;
	font-weight: bold;
	margin-bottom: 5px;
}

.c_chatdate{
	font-size: 1rem;
	color: #656565;
}


.c_ttl_type01.has_button{
    padding-bottom: 0;
}
.c_ttl_type01.has_button::after{
    content: none;
}
