@charset "UTF-8";
/*-----------------------------
blog
-----------------------------*/
#blog {
	padding: 120px 0;
}
.blog-loop {
	display: flex;
	flex-wrap: wrap;
}
.blog-loop .blog {
	width: 31%;
	position: relative;
	margin-right: 3.5%;
}
 .blog-loop .blog:nth-of-type(3n){
	margin-right: 0;
}
.blog-loop.two-colum .blog {
	width: 48%;
	margin-right: 4%;
}
.blog-loop.two-colum .blog:nth-of-type(2n){
	margin-right: 0;
}
.blog-loop.one-colum .blog {
	padding: 30px 0;
	border-top: 1px solid var(--color1);
	width: 100%;
	margin-right: 0;
}
.blog-loop.one-colum .blog:last-of-type {
	border-bottom: 1px solid var(--color1);
	margin-bottom: 50px;
}
.blog-loop.one-colum .blog a {
	display: flex;
	justify-content: space-between;
}
.blog-loop.one-colum .blog a .blog-img {
	width: 30%;
}
.blog-loop.one-colum .blog a .blog-content {
	width: 67%;
}
.blog a:hover {
	color: var(--color1);
}
.blog .blog-link{
	color: var(--black-color);
	text-decoration: none;
}
.blog-img{
	position: relative;
	overflow: hidden;
	border-radius: 10px;
}
.blog-img img{
	object-fit: cover;
	width: 100%;
}
.blog a:hover .blog-img{
	transition: all 0.3s;
}
.blog-img .hover{
	opacity: 0;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0,0,0,.4);
	display: flex;
	align-items: center;
	justify-content: center;
}
.blog-img .hover span{
	display: block;
	background: rgba(0,0,0,.4);
	color: var(--white-color);
	font-size: 16px;
	line-height: 36px;
	padding: 10px 28px;
	border-radius: 100px;
}
.blog .blog-link:hover .hover{
	opacity: 1;
}
.blog-content{
	padding: 15px 0 0 0;
}
.blog-content .date{
	font-size: 16px;
	color: var(--color2);
}
.blog-date{
	font-size: 14px;
	line-height: 28px;
	color: var(--color2);
}
.blog h3{
	font-weight: bold;
	font-size: 20px;
	line-height: 28px;
	margin: 10px 0 50px 0;
	width: 100%;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
.blog .post-categories {
	position: absolute;
    top: 0;
    z-index: 2;
}
.blog .post-categories li a {
	padding: 3px 10px;
	margin-bottom: 5px;
	background: var(--color1);
	color: var(--white-color);
	font-size: 14px;
}
.blog .post-categories li a:hover {
	background: var(--color2);
}
.blog-loop.one-colum .blog .post-categories {
    top: 30px;
}

@media screen and (max-width: 768px){
	.blog-loop .blog {
	width: 100% !important;
	margin-right: 0% !important;
	}
}

/*-----------------------------
archive
-----------------------------*/
#single {
	padding-bottom: 120px;
}
#single .inner {
	display: flex;
	justify-content: space-between;
}
#single .inner .left {
	width: 70%;
}
#single .inner .right {
	width: 27%;
}
.navigation .nav-links{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	padding: 40px 0 0 0;
}
.navigation .screen-reader-text {
	display: none;
}
.navigation a,
.navigation .current{
	display: block;
	box-sizing: border-box;
	border: 1px solid var(--color1);
	line-height: 1;
	line-height: 50px;
	min-width: 50px;
	white-space: nowrap;
	text-align: center;
	text-decoration: none;
	color: var(--color1);
	font-weight: bold;
}
.navigation a + a{
	border-left: 0;
}
.navigation .current{
	background: var(--color1);
	color: var(--white-color);
	pointer-events: none;
}
.navigation a.prev,
.navigation a.next{
	width: 50px;
}
.navigation a:hover {
	background: var(--color1);
	color: var(--white-color);
}
.navigation .page-numbers.dots {
	margin: 7px 10px;
}
#sidebar section {
	padding: 30px;
	background: var(--white-color);
	border-radius: 10px;
	margin-bottom: 20px;
}
#sidebar h3{
	background: var(--color1);
	line-height: 1;
	font-size: 18px;
	padding: 16px 20px;
	color: var(--white-color);
}
#sidebar li.cat-item {
    text-align: left;
    width: 100%;
}
#sidebar li.cat-item a {
	display: inline-block;
    padding: 15px 0;
    border-bottom: 1px solid var(--color1);
	color: var(--color1);
	border-radius: 0;
	width: 100%;
	position: relative;
	font-weight: bold;
}
#sidebar li.cat-item a:hover {
	color: var(--color2);
}
#sidebar li.cat-item a::after {
	content:'〉';
	position: absolute;
	right: 10px;
}
#sidebar li.cat-item a:hover::after {
	right: 0;
	transition: all 0.2s;
}
#sidebar .widget_archive li {
    text-align: left;
    width: 100%;
}
#sidebar .widget_archive li a {
	display: inline-block;
    padding: 15px 0;
    border-bottom: 1px solid var(--color1);
	color: var(--color1);
	border-radius: 0;
	width: 100%;
	position: relative;
	font-weight: bold;
}
#sidebar .widget_archive li a:hover {
	color: var(--color2);
}
#sidebar .widget_archive li a::after {
	content:'〉';
	position: absolute;
	right: 10px;
}
#sidebar .widget_archive li a:hover::after {
	right: 0;
	transition: all 0.2s;
}

/*----Media query----*/
@media screen and (max-width: 1000px){
  #single {
    margin-top: 0 !important;
  }
}

/*-----------------------------
single
-----------------------------*/
.singler{
    padding-top: 90px;
}
#single {
	margin-top: 30px;
}
#single .left {
	padding: 30px 30px 50px;
	background: var(--white-color);
	border-radius: 10px;
}
#single .left .news-single-content-title {
	margin-bottom: 30px;
}
#single .left .news-single-content-thumbnail {
	margin-bottom: 50px;
}
#single .left .news-single-content-thumbnail img {
	margin: 0 auto;
	display: block;
}
#single .left .date {
	color:var(--color2);
}
#single .left h1 {
	font-size:28px;
	color: var(--black-color);
	margin-bottom: 20px;
	margin-top: 10px;
}
#single .left .product-cat ul {
	display:flex;
}
#single .left .product-cat ul li a {
    padding: 3px 10px;
	margin-right: 20px;
    margin-bottom: 5px;
    background: var(--color1);
    color: var(--white-color);
    font-size: 14px;
}
#single .left .product-cat ul li a:hover {
	background: var(--color2);
}
#toc_container {
}
.singlepagenav{
	max-width: 100%;
	margin: 80px auto;
	display: flex;
	justify-content: space-between;
}
.singlepagenav .nav{
	position: relative;
	width: 48%;
}
.singlepagenav a{
	background: var(--color1);
	color: var(--white-color);
	display: block;
	width: 100%;
	box-sizing: border-box;
	padding: 20px;
	text-decoration: none;
	border-radius: 10px;
}
.singlepagenav a:hover {
	background: var(--color2);
	transition: all 0.2s;
}
.singlepagenav a .subTitle{
	display: block;
	line-height: 1;
	font-size: 20px;
	padding-bottom: 20px;
	margin: 0 0 20px 0;
	border-bottom: 1px solid var(--white-color);
}
.singlepagenav a .title{
	font-size: 16px;
	line-height: 28px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.singlepagenav .prev a{
	padding-left: 60px;
}
.singlepagenav .prev::before {
	content: "◀";
	position: absolute;
    top: 50%;
    transform: translate(-10%, -50%);
    -webkit-transform: translate(-10%, -50%);
    -ms-transform: translate(-10%, -50%);
	left: 25px;
	z-index: 999;
	color: var(--white-color);
}
.singlepagenav .prev:hover::before {
	left: 15px;
	transition: all 0.2s;
}
.singlepagenav .next a {
	text-align: right;
	padding-right: 60px;
}
.singlepagenav .next::after {
	content: "▶";
	position: absolute;
    top: 50%;
    transform: translate(-10%, -50%);
    -webkit-transform: translate(-10%, -50%);
    -ms-transform: translate(-10%, -50%);
	right: 25px;
	z-index: 999;
	color: var(--white-color);
}
.singlepagenav .next:hover::after {
	right: 15px;
	transition: all 0.2s;
}

/*----Media query----*/
@media screen and (max-width: 768px){
	#single {
		padding-bottom: 80px;
	}
}

/*-----------------------------
edit
-----------------------------*/
.entry-content {
  margin-bottom: 80px;
}

.entry-content h2 {
  padding-top: 80px !important;
  background-color: var(--color);
  font-size: 24px;
  color: var(--color1);
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--color1);
  text-align: left;
}

.entry-content h3 {
  font-size: 18px;
  font-weight: bold;
  background-color: var(--gray-color);
  margin: 20px 0;
  padding: 10px 15px;
  border-radius: 5px;
}

.entry-content p,
.entry-content li,
.entry-content blockquote {
  line-height: 2.15;
}

.entry-content a {
  color: var(--color2);
  display: inline-block;
  text-decoration: underline;
  line-height: 1.5;
}
.entry-content a:hover {
  color: var(--color1);
}

.entry-content img {
  margin: 20px auto;
  width: 100%;
  display: block;
}

.entry-content img.ph50 {
  max-width: 50%;
}

.entry-content li {
  list-style-position: inside;
}

.entry-content ul li {
  list-style-type: disc;
}

.entry-content ol li {
  list-style-type: decimal;
}

.entry-content video {
  height: auto;
}

.entry-content blockquote {
  padding: 20px !important;
  border: 1px solid var(--black-color)!important;
  background: #eee;
  position: relative;
}

.entry-content blockquote::before,
.entry-content blockquote::after {
  color: var(--black-color);
  font-size: 2rem;
  line-height: 1;
  position: absolute;
}

.entry-content blockquote::before {
  content: "❝";
  top: 2px;
  left: 5px;
}

.entry-content blockquote::after {
  content: "❞";
  bottom: 2px;
  right: 5px;
}

.entry-content .margin_b5 {
  margin-bottom: 5px !important;
}

.entry-content .margin_b10 {
  margin-bottom: 10px !important;
}

.entry-content .margin_b15 {
  margin-bottom: 15px !important;
}

.entry-content .margin_b20 {
  margin-bottom: 20px !important;
}

.entry-content .margin_b25 {
  margin-bottom: 25px !important;
}

.entry-content .margin_b30 {
  margin-bottom: 30px !important;
}

.entry-content .margin_b35 {
  margin-bottom: 35px !important;
}

.entry-content .margin_b40 {
  margin-bottom: 40px !important;
}

.entry-content .margin_b45 {
  margin-bottom: 45px !important;
}

.entry-content .margin_b50 {
  margin-bottom: 50px !important;
}
.entry-content .margin_b60 {
  margin-bottom: 60px !important;
}

.entry-content .f10 {
  font-size: 10px !important;
}

.entry-content .f11 {
  font-size: 11px !important;
}

.entry-content .f12 {
  font-size: 12px !important;
}

.entry-content .f13 {
  font-size: 13px !important;
}

.entry-content .f14 {
  font-size: 14px !important;
}

.entry-content .f15 {
  font-size: 15px !important;
}

.entry-content .f16 {
  font-size: 16px !important;
}

.entry-content .f17 {
  font-size: 17px !important;
}

.entry-content .f18 {
  font-size: 18px !important;
}

.entry-content .f19 {
  font-size: 19px !important;
}

.entry-content .f20 {
  font-size: 20px !important;
}

.entry-content .f21 {
  font-size: 21px !important;
}

.entry-content .f22 {
  font-size: 22px !important;
}

.entry-content .f23 {
  font-size: 23px !important;
}

.entry-content .f24 {
  font-size: 24px !important;
}

.entry-content .f25 {
  font-size: 25px !important;
}

.entry-content .f30 {
  font-size: 30px !important;
}

.entry-content .f35 {
  font-size: 35px !important;
}

.entry-content .f40 {
  font-size: 40px !important;
}

.entry-content .f45 {
  font-size: 45px !important;
}

.entry-content .f50 {
  font-size: 50px !important;
}

.entry-content .bold {
  font-weight: bold !important;
}

.entry-content .red {
  color: red !important;
}

.entry-content .pink {
  color: pink !important;
}

.entry-content .gray {
  color: gray !important;
}

.entry-content .blue {
  color: blue !important;
}

.entry-content .has-text-align-center {
  text-align: center;
}

.entry-content .text_right {
  text-align: right;
}

.entry-content .mk_yellow {
  background-color: yellow !important;
}

.entry-content .bg_yellow {
  padding: 15px !important;
  background-color: #fffde0 !important;
  border: 1px solid #bbbbbb !important;
}

.entry-content .bg_blue {
  padding: 15px !important;
  background-color: #e4efff !important;
  border: 1px solid #bbbbbb !important;
}

.entry-content .bg_pink {
  padding: 15px !important;
  background-color: #fff1f1 !important;
  border: 1px solid #bbbbbb !important;
}

.entry-content .bg_gray {
  padding: 15px !important;
  background-color: #f9f9f9 !important;
  border: 1px solid #bbbbbb !important;
}

.entry-content .bg_yellow_iv {
  background-color: rgba(255, 253, 224, 0.5) !important;
}

.entry-content .bg_blue_iv {
  background-color: rgba(228, 239, 255, 0.5) !important;
}

.entry-content .bg_pink_iv {
  background-color: rgba(255, 241, 241, 0.5) !important;
}

.entry-content .bg_gray_iv {
  background-color: rgba(249, 249, 249, 0.5) !important;
}

.entry-content .bg_quest_iv {
  font-family: "dot";
  color: #fff;
  background-color: black;
}

.entry-content .button{
	display: block;
	text-align: center;
	max-width: 320px;
	width: 100%;
	color: var(--white-color);
	font-size: 20px;
	font-weight: 500;
	padding: 20px 0;
	box-sizing: border-box;
	background: var(--color2);
	text-decoration: none;
	border-radius: 100px;
}
.entry-content .button:hover{
	background: var(--color1);
	color: var(--white-color);
}

.entry-content .button_green {
	display: block;
	text-align: center;
	max-width: 320px;
	width: 100%;
	color: var(--white-color);
	font-size: 20px;
	font-weight: 500;
	padding: 20px 0;
	box-sizing: border-box;
	background: #58be89;
	text-decoration: none;
	border-radius: 100px;
}

.entry-content .button_blue {
	display: block;
	text-align: center;
	max-width: 320px;
	width: 100%;
	color: var(--white-color);
	font-size: 20px;
	font-weight: 500;
	padding: 20px 0;
	box-sizing: border-box;
	background: #0e7ac4;
	text-decoration: none;
	border-radius: 100px;
}

.entry-content .button_orange {
	display: block;
	text-align: center;
	max-width: 320px;
	width: 100%;
	color: var(--white-color);
	font-size: 20px;
	font-weight: 500;
	padding: 20px 0;
	box-sizing: border-box;
	background: #fba848;
	text-decoration: none;
	border-radius: 100px;
}

.entry-content .button_green:hover,
.entry-content .button_blue:hover,
.entry-content .button_orange:hover{
	background: #7f7f7f;
	color: var(--white-color);
}

.entry-content table {
  width: 100%;
  border-collapse: collapse;
}

.entry-content table tr th,
.entry-content table tr td {
  padding: 15px 20px;
  border: 1px solid #bbb;
  vertical-align: middle;
  line-height: 2;
}

.entry-content table tr th {
  font-weight: bold;
  background: #eee;
}

.entry-content table th:nth-child(1) {
  width: 30%;
}

.entry-content .b-col2 {
  padding: 30px;
  background: #ddd;
}

.entry-content .b-col2-wrap {
  display: flex;
  flex-flow: row wrap;
}

.entry-content .b-col2-wrap > p {
  width: 65%;
}

.entry-content .form-block {
  width: 35%;
  padding-top: 8px;
  font-weight: bold;
}

.entry-content .c-pink {
  font-size: 12px;
  font-size: 1.2rem;
  padding: 3px 5px;
  color: var(--white-color);
  background: #e95996;
  margin-right: 10px;
  font-weight: bold;
}

.entry-content .c-skyblue {
  font-size: 12px;
  font-size: 1.2rem;
  padding: 3px 5px;
  color: var(--white-color);
  background: #59c1df;
  margin-right: 10px;
  font-weight: bold;
}

.entry-content .is-consent {
  margin: 20px 0;
  text-align: center;
}

.entry-content .is-consent label {
  padding: 20px 35px;
  border: 1px solid rgba(0, 0, 0, 0.5);
  cursor: pointer;
  display: inline-block;
}

.entry-content .arrow-r {
  text-align: center;
}

.entry-content .arrow-r input {
  width: 380px;
  padding: 20px 0;
  background: #3473b8;
  color: var(--white-color);
  display: inline-block;
}

.entry-content .serif {
  overflow: hidden;
  display: block;
  margin-bottom: 30px;
  position: relative;
  min-height: 80px;
  padding-left: 80px;
  font-size: 18px;
  line-height: 1.9;
  font-weight: normal;
}

.entry-content .serif > img {
	position: absolute;
	top: 0;
	left: 0;
	width: 60px;
	height: 60px;
	display: block;
	margin: 0;
	border-radius: 40px;
}

.entry-content .serif .serif_box {
  padding: 15px;
  border-radius: 4px;
  border: solid 1px var(--black-color) !important;
  position: relative;
  line-height: 1.5;
}

.entry-content .serif .serif_box > span {
  display: inline;
  font-size: 16px;
  line-height: 1.9;
  font-weight: normal;
}

.entry-content .serif .serif_box::after {
  position: absolute;
  top: 18px;
  left: -21px;
  content: "";
  height: 0;
  width: 0;
  border: 10px solid rgba(255, 255, 255, 0);
  border-right: 10px solid var(--color1);
}

.entry-content .serif_l {
  overflow: hidden;
  display: block;
  margin-bottom: 30px;
  position: relative;
  min-height: 80px;
  padding-right: 80px;
  font-size: 18px;
  line-height: 1.9;
  font-weight: normal;
}

.entry-content .serif_l > img {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  margin: 0;
  width: 60px;
  height: 60px;
  border-radius: 40px;
}

.entry-content .serif_l .serif_box {
  padding: 15px;
  border-radius: 4px;
  border: solid 1px var(--color2) !important;
  position: relative;
  line-height: 1.5;
}

.entry-content .serif_l .serif_box > span {
  display: inline;
  font-size: 16px;
  line-height: 1.9;
  font-weight: normal;
}

.entry-content .serif_l .serif_box::after {
  position: absolute;
  top: 18px;
  right: -21px;
  content: "";
  height: 0;
  width: 0;
  border: 10px solid rgba(255, 255, 255, 0);
  border-left: 10px solid var(--color2);
}


@media screen and (max-width: 768px){
	#page_info.page-t-w, #page_info.text-white {
		margin-bottom: 0px;
	}
	#single .inner {
		display: block;
	}
	#single .inner .left {
		width: 100%;
		margin-bottom: 20px;
	}
	#single .inner .right {
		width: 100%;
	}
	#single .left {
		padding: 20px;
		background: var(--white-color);
		border-radius: 10px;
	}
	.singlepagenav .nav {
		position: relative;
		width: 100%;
	}
	.singlepagenav .prev {
		margin-bottom: 20px;
	}
	.singlepagenav a {
		padding: 15px;
		border-radius: 5px;
	}
	.singlepagenav {
		margin: 50px auto;
		display: block;
	}
	.singlepagenav a .subTitle {
		font-size: 18px;
		padding-bottom: 10px;
		margin: 0 0 10px 0;
	}
	#sidebar section {
		padding: 20px;
	}
}