.content { padding: 0; }
.content h2.title,
.content p.title{ padding-top: 20px; }

.section-tabs{ background-color: #f4f6f1; /*position: sticky; top: 100px;*/ width: 100%; z-index: 3; padding: 10px 0;}
.section-tabs .tabs{ width: 90%; max-width: 1200px; display: flex; margin: 0 auto;}
.section-tabs .tabs li{ width: 24%; background-color: #fff; background-image: url("../images/tips/ic_circle.png"); background-repeat: no-repeat; background-position: 95% 50%; background-size: 20px auto; border: #139ea1 solid 2px; margin: 0 0.5%; padding: 8px 35px 10px 10px; color: #139ea1; text-align: left; font-size: 18px; font-weight: 500; cursor: pointer; transition: background-color ease-out 0.2s; }
.section-tabs .tabs li.actived,
.desktop .section-tabs .tabs li:hover{ background-color: #ffec68; transition: background-color ease-out 0.2s;  }

.section-tips-list{ padding: 40px 0;}
.section-tips-list:nth-of-type(odd){ background-color: #fff;}
/*.section-tips-list:last-child{ padding-bottom: 200px;}*/
.section-tips-list .container{ width: 90%; max-width: 1100px; }
.section-tips-list h2{ color: #139ea1; font-size: 28px; font-weight: 500; border-left: #ffec68 solid 6px; border-right: #ffec68 solid 6px; display: inline-block; margin:0 auto 30px; padding: 0 12px; line-height: 1; vertical-align: baseline;}
.section-tips-list ul{ display: flex; flex-wrap: wrap; margin: 0 auto;}
.section-tips-list ul li{ width: 31.3333%; margin: 0 1% 50px; }
.section-tips-list ul li a{ text-align: left;}
.section-tips-list ul li figure{ border: #139ea1 solid 1px; overflow: hidden; margin-bottom: 5px;}
.section-tips-list ul li figure img{ transition: transform ease-out 0.3s;}
.desktop .section-tips-list ul li:hover figure img{ transform: scale(1.05); transition: transform ease-out 0.3s; }
.section-tips-list ul li figcaption{}
.section-tips-list ul li figcaption h3{ /*color: #139ea1;*/ color: #555555; font-size: 20px; font-weight: 500; padding: 5px 0; /*overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;*/ line-height: 1.3;}
.section-tips-list ul li figcaption p{ /*color: #555555; min-height: 50px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.5; margin-bottom: 10px;*/ display: none;}
.section-tips-list ul li figcaption .btn{ /*width: 130px; text-align: center;*/ display: none;}
.desktop .section-tips-list ul li:hover figcaption .btn{ transition: all 200ms ease-out; opacity: 0.7;}

.section-tips-list .comingsoon{ padding: 70px 0; color: #139ea1; font-size: 30px;}

h2.tip-title,
p.tip-title{ padding: 20px 0; margin-bottom: 0; }
h2.tip-title span,
p.tip-title span{ color: #139ea1; font-size: 26px; font-weight: 500; border-left: #ffec68 solid 6px; border-right: #ffec68 solid 6px; display: inline-block; margin:0 auto; line-height: 1; vertical-align: baseline; padding: 0 12px;}
.tip-content{ background-color: #fff; text-align: left; padding: 30px 0;}
.tip-content .container{ width: 90%; max-width: 860px; }
.tip-content h1{ color: #139ea1; font-size: 30px; font-weight: 500; border-left: #ffec68 solid 6px; display: inline-block; margin:0 auto 25px; padding: 0 12px; line-height: 1.3; vertical-align: baseline;}
.tip-content article{ font-size: 18px; clear: both; padding-bottom: 30px; border: #000 solid 0px;}
.tip-content article figure{ width: 100%; max-width: 450px; float: right; padding: 0 0 20px 20px;}
.tip-content article figure img{ border: #139ea1 solid 1px;}
.tip-content article a{ color: #00b7ee; text-decoration: underline;}
.tip-content article h2{ color: #00b7ee; margin-bottom: 10px; font-size:22px;}
.tip-content article h3{ color: #ff5400; margin-bottom: 3px; font-size:18px;}
.tip-content article h4{ color: #ff5400; margin-bottom: 3px; }
.tip-content article p{ font-size: 18px; }
.tip-content article p.author{ font-size: 16px; padding-left: 18px; color: #139ea1;}
.tip-content article .pic{ margin: 0 auto 30px; width: 100%; max-width: 720px;}
.tip-content article ul.dot{ font-size: 18px; margin-bottom: 20px;}
.tip-content article ul.dot li{ padding-left: 20px; margin-bottom: 10px; position: relative;}
.tip-content article ul li{ margin-bottom: 10px; }
.tip-content article ul.dot li::before{ content: ''; width: 6px; height: 6px; border-radius: 6px; top: 13px; left: 6px; background-color: #139ea1; position: absolute;}
.tip-content article ol{ margin-left: 20px; margin-bottom: 20px;}
.tip-content article ol li{ margin-bottom: 10px;}
.tip-content article li h4{ margin-bottom: 0;}
.tip-content article table{ border-top: #139ea1 solid 1px; border-left: #139ea1 solid 1px; margin-bottom: 30px; }
.tip-content article table tr{ border-bottom: #139ea1 solid 1px; }
.tip-content article table .header{ font-weight: 500; color: #139ea1; background-color: #f4f6f1;}
.tip-content article table td{ border-right: #139ea1 solid 1px; padding: 7px 10px; vertical-align: middle;}
.tip-content article table td.center{ text-align: center;}
.tip-content article table .thumb{ width: 90%; max-width: 120px; margin: 0 auto;}
.tip-content article strong{ font-weight: 500; }

.tip-content article .label{ color:#ff5400;}


.tip-content .dr-kajita{ background-color: #f4f6f1; display: flex; justify-content: space-between; border-radius: 8px; overflow: hidden;}
.tip-content .dr-kajita .icon{ width: 40px; background-color: #139ea1; display: flex; justify-content: center; align-items: center; position: relative;}
.tip-content .dr-kajita .icon::before{ content: ''; width: 0; height: 0; border-style: solid; border-width: 7px 0 7px 10px; border-color: transparent transparent transparent #139ea1; position: absolute; right: -10px; top: calc(50% - 5px); }
.tip-content .dr-kajita .icon img{ width: 20px; }
.tip-content .dr-kajita .pic{ display: flex; align-items: center; width: 120px;  }
.tip-content .dr-kajita .pic img{ width: 80px; margin: 20px auto;}
.tip-content .dr-kajita p{ width: calc(100% - 166px); margin-bottom: 0; font-size: 16px; line-height: 1.5; padding: 10px 20px 10px 0; display: flex; align-items: center;}


.tip-content .btn-container{ text-align: center; margin: 30px auto; }
.tip-content .btn-container .btn{ margin: 0 10px; }

.tip-content article.tip-1-1 .txt-list{ }
.tip-content article.tip-1-1 .txt-list li{ display: flex; font-size: 18px; line-height:1.75;}
.tip-content article.tip-1-1 .txt-list .label{ width:80px; text-align:center; color:#139ea1;}
.tip-content article.tip-1-1 .txt-list .txt{ width:calc(100% - 80px);}

.tip-content article.tip-1-3 .table{ display:table; width:100%; margin:15px 0; border-top:#139ea1 solid 1px; border-left:#139ea1 solid 1px; font-size: 18px;}
.tip-content article.tip-1-3 .table .row{ display:table-row;}
.tip-content article.tip-1-3 .table .row.table-header{ background-color:#139ea1; color:#FFF;}
.tip-content article.tip-1-3 .table .row.table-header .cell{}
.tip-content article.tip-1-3 .table .cell{ display:table-cell; padding:7px 10px; border-right:#139ea1 solid 1px; border-bottom:#139ea1 solid 1px;}
.tip-content article.tip-1-3 .table .cell.label{ width:130px; vertical-align:middle;}
.tip-content article.tip-1-3 .table .cell.txt{}



.tip-content article.tip-2-1 table tr.header td:nth-child(1){ width: 30%; }
.tip-content article.tip-2-1 table tr.header td:nth-child(2){ width: 70%; }

.tip-content article.tip-2-2 li strong{ color: #ff5400; }

.tip-content article.tip-3-1{ padding:0; color: #5b4684; font-size: 22px; font-weight: 400;}
.tip-content article.tip-3-1 .flex-row{ display: flex;}
.tip-content article.tip-3-1 .flex-column{ display: flex; flex-direction: column;}
.tip-content article.tip-3-1 .flex-row-reverse{ flex-direction: row-reverse;}
.tip-content article.tip-3-1 .flex-center{ justify-content: center; }
.tip-content article.tip-3-1 .flex-between{ justify-content: space-between; }
.tip-content article.tip-3-1 .text-center{ text-align: center;}

.tip-content article.tip-3-1 .article{ padding: 50px 5%; font-size: 22px;}
.tip-content article.tip-3-1 .article h2.title{ color: #5b4684; font-size: 40px; font-weight: 700; border: #5b4684 solid 1px; border-radius: 100px; padding: 0px 30px; text-align: center; width: 100%; max-width: 750px; margin: 0 auto 30px; box-shadow: #ece9f1 2px 2px 5px;
background: rgb(253,253,254);
background: -moz-linear-gradient(-45deg,  rgba(253,253,254,1) 0%, rgba(253,253,254,1) 100%);
background: -webkit-linear-gradient(-45deg,  rgba(253,253,254,1) 0%,rgba(253,253,254,1) 100%);
background: linear-gradient(135deg,  rgba(253,253,254,1) 0%,rgba(253,253,254,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fdfdfe', endColorstr='#fdfdfe',GradientType=1 );
}
.tip-content article.tip-3-1 .article h2{ font-size: 36px; font-weight: 500;}
.tip-content article.tip-3-1 .article h3{ font-size: 30px; font-weight: 500;}
.tip-content article.tip-3-1 .article h4{ font-size: 26px; font-weight: 500; color: #5b4684;}
.tip-content article.tip-3-1 .article p{ font-size: 22px; }
.tip-content article.tip-3-1 .note{ font-size: 15px;}

.tip-content article.tip-3-1 .article .for-parent{ width: 100%; max-width: 700px; background-color: #FFF; border: #5b4684 solid 1px; border-radius: 30px; margin: 50px auto 30px; padding: 0px 3% 0 5%;}
.tip-content article.tip-3-1 .article .for-parent h4{ color: #FFF; background-color: #5b4684; display: inline-block; width: 200px; border-radius: 30px; text-align: center; margin: 0 auto 0 -100px; padding: 7px 0 10px; line-height: 1; top: -20px; left: 50%; position: relative;}
.tip-content article.tip-3-1 .article .for-parent p{ }

.tip-content article.tip-3-1 .article-kv{ background-color: #838ac3; padding: 50px 3%;}
.tip-content article.tip-3-1 .article-kv .box{ width: 50%;}
.tip-content article.tip-3-1 .article-kv .box:nth-child(1) .title{ width: 90%; max-width: 330px; margin: 0 auto 30px;;}
.tip-content article.tip-3-1 .article-kv .box:nth-child(1) .text{ color: #FFF; text-align: center; font-weight: 500; line-height: 1.5;}
.tip-content article.tip-3-1 .article-kv .box:nth-child(1){}
.tip-content article.tip-3-1 .article-kv .box:nth-child(2){ padding: 0 10px;}
.tip-content article.tip-3-1 .article-kv .box:nth-child(2) .pic{ width: 100%; max-width: 400px; height: auto; margin: 0 auto;}
.tip-content article.tip-3-1 .article-1{}
.tip-content article.tip-3-1 .article-1 .box{ width: 100%; max-width: 700px; margin: 0 auto 30px; padding-bottom: 30px; }
.tip-content article.tip-3-1 .article-1 .box p{ margin-bottom: 0; }
.tip-content article.tip-3-1 .article-1 .box .inner-box{ width: 50%; }
.tip-content article.tip-3-1 .article-1 .box-1{}
.tip-content article.tip-3-1 .article-1 .box-1 ul{ width: 100%; max-width: 620px; margin: 0 auto;}
.tip-content article.tip-3-1 .article-1 .box-1 ul li{ color: #000; background: url("../images/tips/8/ic_check.png") 0 6px no-repeat; background-size: 25px; padding-left: 32px; margin-bottom: 5px;}
.tip-content article.tip-3-1 .article-1 .box-2{}
.tip-content article.tip-3-1 .article-1 .box-2 .pic{ width: 230px; margin: 0 auto;}
.tip-content article.tip-3-1 .article-1 .box-3 .pic{ width: 330px; margin: 0 auto;}
.tip-content article.tip-3-1 .article-1 .box-4 .inner-box:nth-child(1){ width: 52%; }
.tip-content article.tip-3-1 .article-1 .box-4 .inner-box:nth-child(2){ width: 48%; }

.tip-content article.tip-3-1 .article-1 .box-4 .pic{ width: 250px; margin: 0 auto;}
.tip-content article.tip-3-1 .article-1 .box-5{ border: #5b4684 solid 3px; border-radius: 15px; padding-bottom: 0px; overflow: hidden; }
.tip-content article.tip-3-1 .article-1 .box-5 h4{ background-color: #5b4684; color: #fff; text-align: center; padding-bottom: 5px;}
.tip-content article.tip-3-1 .article-1 .box-5 .text{ padding: 20px 5% 0; }
.tip-content article.tip-3-1 .article-1 .box-5 .text p{ margin-bottom: 20px;}
.tip-content article.tip-3-1 .article-1 .box-5 .text .pic{ width:100%; max-width: 580px; margin: 0 auto;}
.tip-content article.tip-3-1 .article-1 .box-5 .text .note{ text-align: right; }

.tip-content article.tip-3-1 .article-2{ background-color: #eff0f7;}
.tip-content article.tip-3-1 .article-2 h3.subtitle{ background-color: #5b4684; color: #fff; display:block; margin: 0 auto 30px;
padding: 5px 10px; text-align-last: center; border-radius: 10px;}
.tip-content article.tip-3-1 .article-2 .box{ width: 100%; max-width: 700px; margin: 0 auto 30px; padding-bottom: 30px; }
.tip-content article.tip-3-1 .article-2 .box p{ margin-bottom: 0; }
.tip-content article.tip-3-1 .article-2 .box .inner-box:nth-child(1){ width: 60%; }
.tip-content article.tip-3-1 .article-2 .box .inner-box:nth-child(2){ width: 40%; }
.tip-content article.tip-3-1 .article-2 .box-1 .pic{ width: 130px; margin: 0 auto;}
.tip-content article.tip-3-1 .article-2 .box-2 .pic{ width: 210px; margin: 0 auto;}
.tip-content article.tip-3-1 .article-2 .box-3 .pic{ width: 210px; margin: 0 auto;}
.tip-content article.tip-3-1 .article-2 .box-3 .flex-row{ background-color: #dbdbee; padding: 30px 2% 30px 5%; border-radius: 15px; margin: 10px auto;}
.tip-content article.tip-3-1 .article-2 .box-3 .flex-row ul{}
.tip-content article.tip-3-1 .article-2 .box-3 .flex-row ul li{ position: relative; padding-left: 22px; margin-bottom: 5px;}
.tip-content article.tip-3-1 .article-2 .box-3 .flex-row ul li::before{ content: ''; background-color: #fff100; border-radius: 100%; width: 13px; height: 13px; top: 12px; left: 0; position: absolute;}
.tip-content article.tip-3-1 .article-2 .box-4 .pic{ width: 200px; margin: 0 auto;}

.tip-content article.tip-3-1 .article-3{}
.tip-content article.tip-3-1 .article-3 .box{ width: 100%; max-width: 700px; margin: 0 auto 30px; padding-bottom: 30px; border-bottom: #8777a5 dashed 2px;}
.tip-content article.tip-3-1 .article-3 .box h3{ }
.tip-content article.tip-3-1 .article-3 .box p{ margin-bottom: 0; }
.tip-content article.tip-3-1 .article-3 .box .inner-box{ width: 50%; }
.tip-content article.tip-3-1 .article-3 .box .pic{ }
.tip-content article.tip-3-1 .article-3 .box-1{}
.tip-content article.tip-3-1 .article-3 .box-1 .pic{ width: 150px;}
.tip-content article.tip-3-1 .article-3 .box-2{}
.tip-content article.tip-3-1 .article-3 .box-2 .pic{ width: 330px;}
.tip-content article.tip-3-1 .article-3 .box-3{ border: 0; margin: 0 auto;}
.tip-content article.tip-3-1 .article-3 .box-3 p{margin-bottom: 30px;}
.tip-content article.tip-3-1 .article-3 .box-3 .pic{ width: 80%; max-width: 430px; margin: 0 auto;}

.tip-content article.tip-3-1 .article-4{ background-color: #eff0f7;}
.tip-content article.tip-3-1 .article-4 .title{ width: 90%; max-width: 430px; margin: 0 auto 30px;}
.tip-content article.tip-3-1 .article-4 ol{ width: 90%; max-width: 600px; margin: 0 auto 30px;}
.tip-content article.tip-3-1 .article-4 ol li{ margin-left: 15px;}


/*	RESPONSIVE:  */
@media only screen and (max-width:1300px) {
.section-tabs .tabs{ flex-wrap: wrap; max-width: 990px;}
.section-tabs .tabs li{ width: 32.33%; margin-bottom: 10px; }	
}


/*	RESPONSIVE:  */
@media only screen and (max-width:1080px) {
.section-tabs{ top: 55px; /*overflow-x: scroll;*/ }
.section-tabs .tabs li{ width: 49%; margin-bottom: 10px; }
	
.tip-content article figure{ max-width: 400px; }
	
}


/*	RESPONSIVE:  */
@media only screen and (max-width:768px) {
.section-tabs{ position: static; top: auto; padding: 0;}	
.section-tabs .tabs{ width: 90%; max-width: 500px; margin: 0 auto;}
.section-tabs .tabs li{ width: 100%; }
	
.section-tips-list ul li{ width: 48%; }

.tip-content article figure{ width: 100%; max-width: 400px; float: none; padding: 0; margin:0 auto 20px;}
	
.tip-content article.tip-3-1{ font-size: 20px;}
.tip-content article.tip-3-1 .flex-row{ display: block;}
	
.tip-content article.tip-3-1 .article h2.title{ font-size: 34px; font-weight: 500; padding: 0px 30px; }
.tip-content article.tip-3-1 .article h2{ font-size: 30px; font-weight: 500;}
.tip-content article.tip-3-1 .article h3{ font-size: 26px; font-weight: 500;}
.tip-content article.tip-3-1 .article h4{ font-size: 22px; font-weight: 500;}
.tip-content article.tip-3-1 .article p{ font-size: 20px; }
	
.tip-content article.tip-3-1 .article-kv{ padding: 30px 3%;}
.tip-content article.tip-3-1 .article-kv .box{ width: 100%;}
.tip-content article.tip-3-1 .article-kv .box:nth-child(1) .text{ font-size: 20px; margin-bottom: 30px;}

.tip-content article.tip-3-1 .article-1 .box .inner-box{ width: 100%; }
.tip-content article.tip-3-1 .article-1 .box-1 ul li{ background: url("../images/tips/8/ic_check.png") 0 5px no-repeat; background-size: 18px; padding-left: 25px; }
.tip-content article.tip-3-1 .article-1 .box-2{}
.tip-content article.tip-3-1 .article-1 .box-2 .pic{ width: 230px; max-width: 230px; margin: 20px auto 0;}
.tip-content article.tip-3-1 .article-1 .box-3 .pic{ width: 280px; max-width: 280px; margin: 0 auto;}
.tip-content article.tip-3-1 .article-1 .box-4 .pic{ width: 280px; max-width: 280px; margin: 10px auto 0;}
.tip-content article.tip-3-1 .article-1 .box-4 .inner-box:nth-child(1),
.tip-content article.tip-3-1 .article-1 .box-4 .inner-box:nth-child(2){ width: 100%;}
	
.tip-content article.tip-3-1 .article-2 .box p{ margin-bottom: 0; }
.tip-content article.tip-3-1 .article-2 .box .inner-box:nth-child(1){ width: 100%; }
.tip-content article.tip-3-1 .article-2 .box .inner-box:nth-child(2){ width: 100%; }

.tip-content article.tip-3-1 .article-2 .box-1 .pic{ width: 150px; max-width: 150px; margin: 20px auto 0;}
.tip-content article.tip-3-1 .article-2 .box-2 .pic{ width: 200px; max-width: 200px; margin: 20px auto 0;}
.tip-content article.tip-3-1 .article-2 .box-3 .pic{ width: 200px; max-width: 200px; margin: 20px auto 0;}
.tip-content article.tip-3-1 .article-2 .box-3 .flex-row ul li{ padding-left: 17px; padding-right: 10px; }
.tip-content article.tip-3-1 .article-2 .box-3 .flex-row ul li::before{ width: 10px; height: 10px; top: 9px;}
.tip-content article.tip-3-1 .article-2 .box-4 .pic{ width: 230px; max-width: 230px; margin: 20px auto 0;}
	
.tip-content article.tip-3-1 .article-3 .box .inner-box{ width: 100%; }
.tip-content article.tip-3-1 .article-3 .box-1 .pic{ width: 120px; max-width: 120px; margin: 20px auto 0;}
.tip-content article.tip-3-1 .article-3 .box-2 .pic{ width: 250px; max-width: 250px; margin: 20px auto 0;}
	
}


/*	RESPONSIVE:  */
@media only screen and (max-width:480px) {
		
.section-tips-list ul li{ width: 100%; }
	
.tip-content .dr-kajita{ display: block;}
.tip-content .dr-kajita .icon{ width: 100%; padding: 6px 0;}
.tip-content .dr-kajita .icon::before{ display: none;}
.tip-content .dr-kajita .icon img{ width: 20px; }
.tip-content .dr-kajita .pic{ width: 100%; padding: 10px 0 0; }
.tip-content .dr-kajita .pic img{ width: 80px; margin: 0 auto;}
.tip-content .dr-kajita p{ width: 100%; padding: 10px 20px 20px; }
	
}