@charset "UTF-8";



.content_bgc .wow,
.content_bgc_1 .wow,
.content_bgc_2 .wow,
.content_bgc_3 .wow,
.content_bgc_4 .wow,
.content_bgc_5 .wow {
    animation: none !important;
    -webkit-animation: none !important;
    visibility: visible !important;

    transform: none !important;
    opacity: 1 !important;
}


/* ----------電腦版型--------------------------- */



.TOP .WRAPPER,
.TEXT .WRAPPER,
.AWARD ul {
	margin: 0 auto;
	width: 95%;
	height: 100%;
	max-width: 850px;
}






.title {
	width: 100%;
	text-align: center;
}


.title img {
	width: 50%;

}




/* ==================== */

.mainCoverBox_1 .container {
	max-width: 1280px !important;
}

.mainCoverBox_1 {

	overflow: hidden;
	object-fit: cover;
	width: 100%;
	position: relative;

}



.mainCoverContainer_1 img {
	width: 100%;
	position: relative;
	vertical-align: middle;
}


.mainCoverContainer_1 {
	width: 100%;
	position: relative;
}






.web_1 {
	position: absolute;
	top: 6%;
	left: 19%;
	padding-top: 0%;
	padding-left: 0%;
	z-index: 3;
	display: none;

}

.web_1 img {
	width: 60vw;
}





.boy {
	position: absolute;
	top: 2%;
	right: 15%;
	padding-top: 0;
	padding-left: 0;
	z-index: 3;

}

.boy img {
	width: 31vw;
}


.byetitle {
	position: absolute;

	top: 13%;
	right: 53%;

	padding-top: 0;
	padding-left: 0;
	z-index: 3;

}

.byetitle img {
	width: 20vw;
}


.big_title {
	position: absolute;
	top: 26%;
	left: 16.5%;
	padding-top: 0;
	padding-left: 0;
	z-index: 3;

}

.big_title img {
	width: 39vw;
}



.small_title {
	position: absolute;
	top: 57%;
	left: 21.5%;
	padding-top: 0;
	padding-left: 0;
	z-index: 3;

}

.small_title img {
	width: 30vw;
}


.gift {

	position: absolute;
	top: 62%;
	right: 17%;
	width: 100%;
	z-index: 13;


}


.gift img {
	width: 9vw;
}


.cta .btn:focus {
	outline: none !important;
	border: none !important;
}


.cta {
	position: absolute;
	top: 74%;
	left: 28.5%;
	padding-top: 0;
	padding-left: 0;
	z-index: 13;


}

.cta img {
	width: 14vw;
}



.word_h1 {
	margin-bottom: 30px;
}


.word_h1 h1 {
	color: white;
	font-size: 2.438rem;

	text-align: center;
	margin-bottom: 7px;
	width: 100%;
	font-weight: bold;
	transform: skewX(-5deg);


}



.word_h1 h1>span {
	background: linear-gradient(to top, #abfc5f 0%, #dfffb1 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	font-size: 2.813rem;
	-webkit-text-fill-color: transparent;
}

.word_h1 p {
	font-size: 1.688rem;
	color: #fff;
	margin: 0;
	text-align: center;
	transform: skewX(-5deg);


}

.word_h1 p br {
	display: none;
}

.word_h1 p span {
	color: #dfffb1;
}


.content_box h3 {
	font-size: 2.1rem;
	color: #232323;
	text-align: center;
	font-weight: bold;
	margin-bottom: 1.6px;
}

.content_bgc {
	padding: 90px 0 100px 0;

	background: url(../images/bgc_2.jpg) no-repeat top center;
	background-size: cover;
	position: relative;
	z-index: 3;

}


.content_bgc_1 {
	padding: 90px 0 100px 0;

	background: url(../images/bgc_3.jpg) no-repeat bottom center;
	background-size: cover;
	position: relative;
	z-index: 3;
}


.content_bgc_2 {
	padding: 90px 0 100px 0;
	position: relative;
	background: url(../images/bgc_4.jpg) no-repeat bottom center;
	background-size: cover;
	position: relative;
	z-index: 3;


}


.content_bgc_3 {
	padding: 90px 0 0;
	position: relative;
	background: url(../images/bgc_6.jpg) repeat bottom center;
	background-size: contain;
	z-index: 3;
	overflow: hidden;
}

.content_bgc_4 {
	padding: 90px 0;
	position: relative;
	background: url(../images/lady.png) no-repeat 106% center/47.5% auto,
		url(../images/bgc_7.png) no-repeat center center/cover;
	z-index: 3;
	overflow: hidden;
}


.content_bgc_5 {
	padding: 90px 0;
	position: relative;
	background: url(../images/bgc_6.jpg) no-repeat bottom center;
	background-size: cover;
	z-index: 3;
	overflow: hidden;
}




/* .content_bgc_2::after {
    content: '';
    position: absolute;
    bottom: -21px;
    right: -10px;
    background: url(../images/woman.webp) no-repeat;
    background-size: cover;
       width: 440px;
    height: 360px;
}
 */


.web_content {
	overflow-x: hidden;
	width: 100%;
}



.chart_1 {
	width: 100%;
	display: flex;
	justify-content: center;

}

.chart_1 img {
	width: 80%;
	margin-top: 25px;


}


.chart_1_ph {
	display: none;
}


.word_h1 br {
	display: none;
}

.chart_table tr,
.chart_table th,
.chart_table td {
	color: white;
	text-align: justify;
}



.chart_table tbody tr th br {
	display: none;
}

.chart_table thead tr th br:nth-child(3) {
	display: none;
}

.chart_table thead tr th br:nth-child(2) {
	display: none;
}



.chart_table thead tr th {
	border-bottom: 1px solid white;
}

.chart_table tbody tr td {
	border-bottom: 1px solid white;
}

.chart_table tbody tr th {
	border-bottom: 1px solid white;
}

.chart_table tbody tr:nth-child(4) th,
.chart_table tbody tr:nth-child(4) td {
	border-bottom: none !important
}


.chart_table table thead tr th {
	border-right: 1px solid white;
}

.chart_table table thead tr th br {
	display: none;
}

.chart_table table thead tr th:last-child {
	border-right: none !important
}

.chart_table table tbody tr th {
	border-right: 1px solid white;
}

.chart_table table tbody tr td {
	border-right: 1px solid white;
}

.chart_table table tbody tr td:last-child {
	border-right: none !important
}



.chart_table td {
	font-size: 1.15rem;


}



.chart_table th {
	font-size: 1.55rem;


}



.chart_table table {
	border-collapse: collapse;
	border: 1px solid white;
	font-family: sans-serif;
	font-size: 0.8rem;
	letter-spacing: 1px;
	width: 80%;

	border-radius: 12px;
	overflow: hidden;
	border-collapse: separate;
	border-spacing: 0;
}

.chart_table {
	display: flex;
	justify-content: center;


}


.chart_table caption {
	caption-side: bottom;
	padding: 10px;
	font-weight: bold;
}

.chart_table th {
	text-align: center;

}

.chart_table th,
tr,
td {
	padding: 15px 10px;
	vertical-align: middle;
}

.chart_table th:first-child {
	font-size: 1.15rem;
}


.chart_table table thead th:nth-child(3) {
	color: #dfffb1;
}

.chart_table table thead tr th:nth-child(2) {
	background-color: #00000045;
}

.chart_table table tbody tr td:nth-child(2) {
	background-color: #00000045;
}



.chart_table table thead tr th:nth-child(3) {
	background-color: #dfffb140;
}

.chart_table table tbody tr td:nth-child(3) {
	background-color: #dfffb140;
}


.table_p p {
	text-align: center;
	color: white;
	font-size: 0.938rem;
	margin-top: 30px;
}


.btn-go a {
	font-size: 1.5rem;
	color: #2e302a;
	background: linear-gradient(to top, #abfc5f 0%, #dfffb1 100%);
	padding: 15px 15px;
	font-weight: bold;
	border-radius: 7px;
	display: block;
	width: 300px;
	text-align: center;
	letter-spacing: 2px;
}

.word_h2 {
	/* display: flex;
	justify-content: center;
	align-items: center; */
}

.word_h1 h2 {
	background: linear-gradient(to top, #abfc5f 0%, #dfffb1 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	text-align: center;
	font-weight: bold;
	font-size: 2.813rem;
	-webkit-text-fill-color: transparent;
	letter-spacing: -0.8px;
	transform: skewX(-5deg);
}

.word_h2 h3 {
	text-align: center;
	color: white;
	border-radius: 50px;
	border: solid 1px white;
	font-size: 1.5rem;
	padding: 1vw 2vw;
	width: 80%;
	margin: 20px auto 0 auto;

}

.btn-go {
	margin: 30px auto 0 auto;
	display: flex;
	justify-content: center;
}

.class_card_box {
	display: flex;
	align-items: center;
	justify-content: space-evenly;
	margin-bottom: 30px;
}

.class_card_box a {
	position: relative;
	top: 0;
	box-shadow: 0 0 0px #3d3d3d;
	transition: .3s;

}


.class_card_box a:hover {
	position: relative;
	top: -6px;

	box-shadow: 0px 0px 8px #abfc5fce;

}






.color_1 .class_online {
	border: solid 1px #abfc5f;
}

.color_2 .class_online {
	border: solid 1px #b8fd74;
}

.color_3 .class_online {
	border: solid 1px #d2fe9c;
}

.color_4 .class_online {
	border: solid 1px #dfffb1;
}

.color_5 .class_online {
	border: solid 1px #abfc5f;
}


.class_online {
	border-radius: 1rem;
	background-color: #00000052;
	padding: 2vw 0;
	width: 80%;
    margin: 110px auto 0 auto;
}


.color_1 .class_online {
	position: relative;
}

.color_1 .class_online::after {
	content: '';
	position: absolute;
	left: -20px;
	top: -33px;
	background-image: url(../images/design-ai.webp);
	background-size: cover;
	width: 100px;
	height: 100px;



}

.color_2 .class_online {
	position: relative;
}


.color_2 .class_online::after {
	content: '';
	position: absolute;
	left: -20px;
	top: -33px;
	background-image: url(../images/office-ai.webp);
	background-size: cover;
	width: 100px;
	height: 100px;
}

.color_3 .class_online {
	position: relative;
}


.color_3 .class_online::after {
	content: '';
	position: absolute;
	left: -20px;
	top: -33px;
	background-image: url(../images/work-ai.webp);
	background-size: cover;
	width: 100px;
	height: 100px;
}



.color_4 .class_online {
	position: relative;
}


.color_4 .class_online::after {
	content: '';
	position: absolute;
	left: -20px;
	top: -33px;
	background-image: url(../images/advertise_ai.webp);
	background-size: cover;
	width: 100px;
	height: 100px;
}

.color_5 .class_img {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	/* margin-bottom: 2rem; */
}


.color_5 .class_img img {
	width: 100%;
	margin: 0rem 2rem;
}


.class_online_1 .all_design p {
	text-align: left;
}



.color_1 .class_online h1 {
	color: #abfc5f;
}

.color_2 .class_online h1 {
	color: #b8fd74;
}

.color_3 .class_online h1 {
	color: #d2fe9c;
}

.color_4 .class_online h1 {
	color: #dfffb1;
}

.color_5 .class_online h1 {
	color: #abfc5f;
}

.class_online h1 {
	font-size: 2rem;

	text-align: center;
	margin-bottom: 27px;
	font-weight: bold;
	line-height: 1.3;
}

.class_online_1 h1 {
	font-size: 2rem;

	text-align: center;
	margin-bottom: 0px;
	font-weight: bold;
	line-height: 1.3;
}

.class_online_1 p {
	font-size: 1.688rem;
	color: #fff;
	margin: 0;
	text-align: center;
	transform: skewX(-5deg);
	margin-bottom: 27px;

}

.class_img {
	width: 100%;
}

.class_img img {
	width: 100%;
}

.color_1 .class_card {
	border: solid 1px #abfc5f;
}

.color_2 .class_card {
	border: solid 1px #b8fd74;
}


.color_3 .class_card {
	border: solid 1px #d2fe9c;
	/* min-height: 340px; */
	/* height: 340px; */
}

.color_4 .class_card {
	border: solid 1px #dfffb1;
}




.class_card {
	border-radius: 0.25rem;
	padding: 12px;
	width: 30%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	min-height: 290px;
}







.class_img p {
	color: white;
	font-size: 1.125rem;
	margin-top: 10px;

}


.color_1 .class_span span {
	color: #abfc5f;
}

.color_2 .class_span span {
	color: #b8fd74;
}


.color_3 .class_span span {
	color: #d2fe9c;
}

.color_4 .class_span span {
	color: #dfffb1;
}

.color_5 .class_span span {
	color: #abfc5f;
}


.class_span span {
	font-size: 1.125rem;
	display: block;
	width: 100%;
	text-align: right;

}




.table_p br {
	display: none;
}


.class_online h1 br {
	display: none;
}

.class_online_1 h1 br {
	display: none;
}

.word_h1 h2 br {
	display: none;
}

.class_cash {
	display: flex;
	align-items: center;
	justify-content: center;

}

.class_cash h3 {
	color: white;
	font-size: 1.5rem;
	position: relative;
	margin: 8px;
}

.class_cash h3::after {
	content: '';
	position: absolute;
	top: 13px;
	right: 0;
	width: 100%;
	height: 2px;
	background-color: white;

}



.class_cash:nth-child(even) {
	margin: 20px 0;
}



.class_cash h4 {
	font-size: 1rem;
	padding: 6px 12px;
	border-radius: .25rem;
	border: solid 1px white;
	margin: 0px;
	color: white;
}

.class_cash h5 {
	position: relative;
}


.class_cash a {
	position: relative;
	font-size: 24px;
	padding: 7px;
	text-decoration: none;
	font-weight: bold;
	color: #212529;
	border-radius: .25rem;
	margin-left: 10px;
}

.class_cash a::after {
	content: '';
	position: absolute;
	top: 30px;
	right: -30px;
	background-image: url(../images/finger.png);
	width: 40px;
	height: 50px;
	background-size: contain;
	background-repeat: no-repeat;
	transform: rotate(-20deg);
}

.color_1 .class_cash h5 {
	color: #abfc5f;
}

.color_1 .class_cash a {
	background-color: #abfc5f;
}

.color_2 .class_cash h5 {
	color: #b8fd74;
}

.color_2 .class_cash a {
	background-color: #b8fd74;
}



.color_3 .class_cash h5 {
	color: #d2fe9c;
	
}

.color_3 .class_cash a {
	background-color: #d2fe9c;
}

.color_4 .class_cash h5 {

	color: #dfffb1;
}

.color_4 .class_cash a {
	background-color: #dfffb1;
}


.color_5 .class_cash h5 {

	color: #abfc5f;
}

.color_5 .class_cash a {
	background-color: #abfc5f;
}


.class_cash h5 {
	margin: 8px;
	font-size: 1.5rem;
	font-weight: bold;
}


.class_cash span {
	font-size: 2rem;
	margin-left: 8px;
}


.all_design {
	width: 23%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	border-radius: .25rem;
	padding: 12px 15px;
	/* min-height: 560px; */
}


.color_design {

	border: solid 1px #abfc5f;
}

.office_design {
	border: solid 1px #b8fd74;
}

.work_design {
	border: solid 1px #d2fe9c;
}

.advertise_design {
	border: solid 1px #dfffb1;
}

.all_design p {
	font-weight: bold;
	margin-bottom: 15px;
	font-size: 1.3rem;
	line-height: 1.3;
}


.all_design a {
	color: white;
	font-size: 1rem;
}

.all_design h6 {
	text-align: center;
	font-size: 24px;
	font-weight: bold;
}



.color_design p {
	color: #abfc5f;

}

.office_design p {
	color: #b8fd74;
}

.work_design p {

	color: #d2fe9c;
}

.advertise_design p {

	color: #dfffb1;
}


.color_design h6 {
	color: #abfc5f;

}

.office_design h6 {
	color: #b8fd74;
}

.work_design h6 {
	color: #d2fe9c;
}

.advertise_design h6 {
	color: #dfffb1;
}

.all_design ul {
	list-style: disc;
	color: white;
	list-style-position: outside;
}

.all_design ul {
	padding-left: 1rem;
}



.class_card_box_all {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 15px;
}


.class_card_box_all li {
	margin-bottom: 8px;

}

.class_card_box_all a:hover {
	text-decoration: underline;

}

.introduction {
	width: 58%;
}

.introduction h1 {
	color: white;
	font-size: 2.438rem;
	text-align: center;
	margin-bottom: 3px;
	width: 100%;
	font-weight: bold;
	transform: skewX(-5deg);
	text-align: left;
}

.introduction h2 {
	font-size: 1.5rem;
	color: #dfffb1;
	margin: 1rem 0 0;
	text-align: left;
	transform: skewX(-5deg);
}

.introduction_box_all {
	display: flex;
	align-items: center;
	justify-content: space-between;
}



.introduction .container {
	width: 90%;
	max-width: 1600px;
	margin: auto;
}

.introduction_box_img {
	width: 110px;
	height: 110px;

}

.introduction_box_img img {
	width: 100%;
	margin-top: 53px;
	position: relative;
}

.introduction_box_p {
	padding: 4.3vw 0.8vw 0vw;
	border-radius: .5rem;
	border: solid 1px #dfffb1;
	width: 205px;
	min-height: 295px;
}

.introduction_box {
	margin-top: -2vw;
	width: 205px;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.introduction_box_p h3 {
	font-size: 1.313rem;
	font-weight: bold;
	color: #dfffb1;

}

.introduction_box_p p {
	color: white;
	font-size: 1rem;
	text-align: justify;
}

.faq {

	display: flex;
	justify-content: center;
}

.faq h1 {
	font-size: 2.625rem;
	color: white;
	text-align: center;
	position: relative;
	display: inline-block;
	font-weight: bold;
	transform: skewX(-5deg);

}


.faq h1::after {
	content: '';
	position: absolute;
	top: 8px;
	left: -44px;
	background-image: url(../images/star.webp);
	background-size: cover;
	width: 26px;
	height: 26px;
}


.faq h1::before {
	content: '';
	position: absolute;
	top: 7px;
	right: -44px;
	background-image: url(../images/star.webp);
	background-size: cover;
	width: 26px;
	height: 26px;
}





/* ------------------faq---------------- */

.faq-section {
	padding: 70px 0 90px;
	position: relative;
}

.faq-head {
	text-align: center;
	margin-bottom: 40px;
}

.faq-head .kicker {
	font-family: "Caveat", cursive;
	font-size: 22px;
	color: var(--blush-deep);
	font-weight: 700;
}

.faq-head h2 {
	font-family: "Noto Serif TC", serif;
	font-size: clamp(26px, 4vw, 36px);
	font-weight: 900;
	margin-top: 4px;
}

.faq-list {
	width: 80%;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin-top: 24px;
}

.faq-item {

	border: solid 1px #dfffb1;
	border-radius: 16px;
	overflow: hidden;

}

.faq-q {

	display: flex;
	align-items: center;
	gap: 14px;
	padding: 10px 20px;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	background-color: #dfffb1;

}

.faq-q .qmark {
	flex-shrink: 0;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: white;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 900;
	font-size: 15px;
	color: rgb(37, 37, 37);
}

.faq-q .qtext {
	flex: 1;
	color: rgb(37, 37, 37);
	line-height: 1.4;
	font-weight: bold;
	font-size: 1.3rem;
}

.faq-q .chev {
	flex-shrink: 0;
	width: 22px;
	height: 22px;
	transition: transform .25s ease;
}

.faq-item.open .chev {
	transform: rotate(180deg);
}

.faq-a {
	max-height: 0;
	overflow: hidden;
	transition: max-height .3s ease;

}

.B05 {
	cursor: pointer;
}

.faq_p {
	text-align: center;
	margin-top: 20px;
}

.faq_p a {

	font-size: 0.938rem;
	text-decoration: underline;
	color: white;

}

.faq_p a:hover {
	color: white;
}

.faq-a-inner {
	padding: 15px 20px 20px 68px;
	font-size: 1.125rem;
	line-height: 1.85;
	color: white;
	background-color: transparent;
}

.faq-a-inner strong {
	color: var(--sage-deep);
	font-size: 1.125rem;
}

/* bottom CTA */
.bottom-cta {
	text-align: center;
	margin-top: 54px;
}

.bottom-cta p {
	font-family: "Caveat", cursive;
	font-size: 22px;
	font-weight: 700;
	color: var(--plum-soft);
	margin-bottom: 16px;
}



.modal-content {
	width: 60%;
	max-width: 930px;
	margin: 0 auto;
}

.modal-content img {
	width: 100%;
}

.modal-dialog {
	max-width: 80% !important;
}

.btn-close {
	position: absolute;
	right: 7px;
	top: 6px;
	width: 2em;
	height: 2em;
	border-radius: 10.25rem;
	opacity: 1;
	background-color: white;

}


.btn_2 {
	padding: 0;
	height: 100%;
	display: flex;
	border: none !important;
}

.btn:focus {}


.btn_pc {}


.btn_ph {
	display: none;
}




/* .modal-content button.btn {
      width: 34%;
    height: 50px;
    margin: 0 auto;
    position: absolute;
    bottom: 18%;
    left: 50%;
    transform: translate(-50%, 0%);
    background-color: #f9c110;
    color: white;
    font-size: 23px;
    border: none;
    border-radius: 51px;
    font-weight: bold;
} */



@media (max-width:600px) {
	.hero {
		padding: 40px 0 30px;
	}

	.note-strip {
		flex-direction: column;
		align-items: center;
		text-align: center;
	}
}

/* -----------------faq-------------------- */



/* ----------------cta---------------*/

.btn-check:focus+.btn,
.btn:focus {
	outline: none !important;
	box-shadow: none !important;
}


/* --------Go---------- */




.pass_btn {
	width: 60%;
	padding: 12px 0;
	background-color: #a3a3a3;
	border-radius: 51px;
	margin: 20px auto 10px auto;
	outline: none;
	border: none;
	font-weight: bold;
	letter-spacing: 2px;
	cursor: not-allowed;
}

.pass_btn.active {
	background-color: #ffc100;
	cursor: pointer;

}




.pass_btn p {
	margin: 0;
	font-size: 1.25rem;
	color: white;

}

.pass-list {
	margin-top: 10px !important;
	gap: 27px !important;
}

/* Checkbox 外層 */
.custom-checkbox {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	cursor: pointer;
	user-select: none;
	justify-content: center;
	margin-top: 10px;
}

/* 隱藏原本的 checkbox */
.custom-checkbox input {
	display: none;
}

/* 自訂 Checkbox */
.checkmark {
	width: 20px;
	height: 20px;
	border: 2px solid #D5D5D5;
	border-radius: 5px;
	background: #fff;
	position: relative;
	transition: all 0.2s ease;
	box-sizing: border-box;
}

/* Hover */
.custom-checkbox:hover .checkmark {
	border-color: #004b35;
}

/* 勾選後 */
.custom-checkbox input:checked+.checkmark {
	background: #004b35;
	border-color: #004b35;
}

/* 白色勾勾 */
.custom-checkbox input:checked+.checkmark::after {
	content: "";
	position: absolute;
	left: 5px;
	top: 1px;
	width: 6px;
	height: 11px;
	border: solid #fff;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

/* 文字 */
.label-text {
	font-size: 17px;
	color: #333;
}




/* ------------------- */


@keyframes move {

	0% {
		transform: translate3d(0, 0%, 0);
	}

	50% {
		transform: translate3d(0, -5%, 0);
	}

	100% {
		transform: translate3d(0, 0%, 0);
	}

}



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

	.introduction_box_p {
		width: 240px;
		min-height: 290px;



	}

	.introduction_box {

		width: 100%;

	}


	.class_card {
		min-height: 340px !important;

	}

	.all_design {
		/* min-height: 600px !important; */
	}
}

@media screen and (min-width:1199px) and (max-width:1399px) {

	.class_card {
		/* min-height: 305px !important; */

	}

	.all_design {

		/* min-height: 600px; */
	}




}

@media screen and (min-width:992px) and (max-width:1198px) {
	.class_card {
		min-height: 290px !important;

	}

	.all_design {

		/* min-height: 520px; */
	}

	.introduction h2 {
		white-space: nowrap;
	}


}



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

	.chart_1 img {
		width: 90%;
	}

	.chart_table table {
		width: 90%;
	}

	.class_online {
		width: 90%;
	}

	.introduction_box {
		width: 32%;
		padding: 4.9vw 0.8vw 0vw;
		margin-top: -6vw;
	}

	.introduction_box_p {
		width: 100%;
		min-height: 265px;
		padding: 5vw 0.8vw 0vw;
	}

	.introduction_box_all {
		width: 100%;
		margin: 0 auto;
	}

	.introduction {
		padding: 0px 0 54vw;
	}

	.content_bgc_4 {
		background: url(../images/lady.png) no-repeat center bottom / 80% auto,
			url(../images/bgc_6.jpg) no-repeat center center / cover fixed;
	}



	.introduction {
		width: 100%;
	}

	.all_design {
		width: 45%;
		margin: 13px 0;

	}

	.class_cash span {
		font-size: 2.063rem;
	}

	.class_cash h5 {
		font-size: 1.688rem;
	}

	.class_cash h3 {
		font-size: 1.313rem;
	}

	.class_cash h4 {
		font-size: 1.563rem;
	}



	.content_bgc_2 {
		background: url(../images/bgc_5.webp) no-repeat bottom center;
		background-size: cover;

	}

	.chart_table tbody tr th br {
		display: block;
	}

	.chart_table thead tr th br:nth-child(3) {
		display: block;
	}

	.chart_table thead tr th br:nth-child(2) {
		display: block;
	}



}



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




	.introduction h2 {
		font-size: 1.5rem;
	}

	.content_bgc_3 {

	}

	.introduction h1 {
		color: white;
		font-size: 1.875rem
	}


	.introduction_box_img {
		width: 100px;
		height: 100px;
	}


	.introduction_box {
		width: 34%;
		padding: 4.9vw 0.5vw 0vw;

	}

	.introduction_box_p {
		width: 100%;
		/* min-height: 315px; */
		padding: 7vw 0.8vw 0vw;
	}


	.all_design {

		/* min-height: 560px; */
	}








	.word_h1 h2 br {
		display: block !important;
	}

	.class_online {
		margin: 60px auto 0 auto;
		width: 100%;
		padding: 4vw 0 4vw;
	}





	.class_online h1 {
		font-size: 1.75rem;
		margin-bottom: 20px;
	}

	.class_online h1 br {
		display: block !important;
	}


	.class_online_1 h1 {
		font-size: 1.75rem;
		margin-bottom: 20px;
	}

	.class_online_1 h1 br {
		display: block !important;
	}


	.table_p br {
		display: block !important;
	}

	.word_h1 h2 {
		font-size: 2.063rem;
	}

	.word_h2 h3 {
		font-size: 1.5rem;
		width: 100%;
	}

	.chart_table table {
		width: 100%;
	}

	.chart_1 img {
		width: 100%;
	}

	.word_h1 p br {
		display: block !important;
	}

	.word_h1 h1 {
		font-size: 1.875rem;
		line-height: 1.3;


	}

	.word_h1 h1>span {
		font-size: 2.063rem;
	}

	.word_h1 p {
		font-size: 1.5rem;
	}

}

@media screen and (min-width:768px) and (max-width:991px) {



	.faq-list {
		width: 100%;
	}




}


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







	.faq-item {
		width: 100%;
		margin: 0 auto;
	}




	.byetitle img {
		width: 57vw;
	}


	.byetitle {
		top: 7%;
		right: 20%;
	}


	.big_title {
		top: 15%;
		left: 2%;

	}


	.big_title img {
		width: 97vw;
	}


	.big_title_pass {
		top: 10%;
		left: 4%;

	}


	.big_title_pass img {
		width: 97vw;
	}



	.small_title {
		top: 32%;
		left: 11%;
	}

	.small_title img {
		width: 80vw;
	}

	.cta img {
		width: 48vw;
	}


	.cta {

		top: 41%;
		left: 24%;
	}

	.boy img {
		width: 93vw;
	}


	.boy {
		position: absolute;
		right: 3%;
		top: 48%;
	}

	.btn_pc {

		display: none;
	}


	.btn_ph {
		display: block;
	}



}

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

	.class_cash:nth-child(even) {
		margin: 3px 0 20px 0;
	}

	.chart_table table thead tr th br {
		display: block;
	}

	.introduction {
		width: 95%;
		margin: 0 auto;
	}



	.all_design {
		/* min-height: 490px; */
	}



	.introduction_box_p {
		width: 100%;
		min-height: auto;
		padding: 9vw 5.8vw 6vw;
	}


	.introduction_box {
		width: 100%;
	}


	.introduction_box_all {
		flex-direction: column;
	}


	.all_design {
		width: 90%;
		margin-bottom: 20px;
	}

	.class_cash h4 {
		padding: 6px 12px;
	}

	.word_h2 h3 {

		width: 95%;
	}


	.class_online {
		width: 95%;
	}

	.class_card {
		width: 90%;
		margin-bottom: 20px;
		margin-bottom: 20px;
	}

	.class_card_box {
		flex-direction: column;
		margin-bottom: 20px;
	}

	.class_card_box_all {
		flex-direction: column;
	}


	.class_cash h3 {
		font-size: 1.313rem;
	}

	.class_cash h4 {
		font-size: 1.5rem;
	}

	.class_cash h5 {
		font-size: 1.688rem;
	}

	.class_cash span {
		font-size: 2.063rem;
	}

	.class_cash {
		align-items: center;
		justify-content: center;
		flex-direction: column;
		margin: 0;
	}

	.class_card::after {
		left: 0px;
		top: -33px;
		width: 85px;
		height: 85px;
	}


	.chart_table table {
		width: 95%;
	}


	.chart_table th {
		font-size: 1.34rem;
	}

	.chart_1 {
		display: none;
	}

	.chart_1_ph {
		width: 100%;
		display: flex;
		justify-content: center;

	}

	.chart_1_ph img {
		width: 95%;



	}



	.content_bgc {
		background-size: cover;
		padding: 60px 0 100px 0;

	}

	.content_bgc_1 {
		background-size: cover;
		padding: 60px 0 100px 0;

	}


	.content_bgc_2 {
		background-size: cover;
		padding: 60px 0 100px 0;

	}


	.faq-list {
		width: 100%;
	}

}

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

	/* */



}

@media screen and (max-width:576px) {
	.class_online {
		width: 90%;
	}

	.word_h2 h3 {
		width: 90%;
	}

	.chart_table table {
		width: 90%;
	}


	.chart_1_ph img {
		width: 90%;
	}


	.content_bgc_4 {
		background: url(../images/lady.png) no-repeat center bottom / 100% auto,
			url(../images/bgc_6.jpg) no-repeat center center / cover fixed;
	}


	.faq-list {
		width: 90%;
	}


	.word_h1 br {
		display: block;
	}


	.chart_table td {
		font-size: 0.95rem;
	}

	.chart_table th {
		font-size: 1.125rem;
	}


	.chart_table th:first-child {
		font-size: 1.125rem;
	}

	.class_cash h5 {
		font-size: 1.5rem;
	}


	.word_h1 h2 {
		font-size: 1.875rem;
		letter-spacing: -2.8px;
	}

	.word_h2 h3 {
		font-size: 1.313rem;
	}

	.color_1 .class_online::after {

		width: 80px;
		height: 80px;
	}


	.color_2 .class_online::after {

		width: 80px;
		height: 80px;
	}


	.color_3 .class_online::after {

		width: 80px;
		height: 80px;
	}


	.color_4 .class_online::after {

		width: 80px;
		height: 80px;
	}

	.introduction_box_p {
		width: 90%;
		min-height: auto;
		padding: 16vw 5.8vw 6vw;
	}


}