@charset "utf-8";



#column_main{
	width: 100%;
}
/* common column */
.columnBox{
	border: 1px solid #c3d7e9;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	-ms-border-radius: 6px;
	-o-border-radius: 6px;
	border-radius: 6px;
	position: relative;
}

.columnBox .image img{
	margin: 2px 0 0 2px;
}

.columnBox .ribbon{
	position: absolute;
	top: -4px;
	left: 8px;
}
.columnBox .detail {
	padding: 15px;
}

.columnBox .detail h3{
	font-size: 15px;
	margin: 0 0 20px 0;
}
.columnBox .detail p{
	font-size: 12px;
	color: #000;
}

/* btn_back */
.btn_back{
	display: inline-block;
	margin: 15px 0 10px 0;
	font-weight: bold;
	font-size: 1.6rem;
	position: relative;
}
.btn_back::before{
	content: "";
	width: 18px;
	height: 18px;
	background: #005bac;
	border-radius: 50%;
	display: inline-block;
	vertical-align: middle;
	margin-right: 5px;
}
.btn_back::after{
	content: "";
	display: inline-block;
	width: 5px;
	height: 5px;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	transform: rotate(45deg)translateY(-50%);
	-webkit-transform: rotate(45deg)translateY(-50%);
	position: absolute;
	top: 50%;
	left: 3px;
}

#dictionary {
	clear: both;
	margin: 0 auto;
	max-width: 940px;
	width: 100%;
	padding: 0 20px;
	position: relative;
}

#dictionary #dic-nav{
	float: right;
	margin: 0 0 20px 0;
	background: #fff;
	border: 1px solid #c3d7e9;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	-ms-border-radius: 6px;
	-o-border-radius: 6px;
	border-radius: 6px;
}
#dictionary #dic-nav ul{
	overflow: hidden;
}

#dictionary #dic-nav li{
	width: 120px;

}
#dictionary #dic-nav li a{
	font-size: 12px;
	display: block;
	padding: 18px 0;
	text-align: center;
	font-weight: bold;
	line-height: 1;
	color: #005bac;
}

#dictionary #dic-nav li a:hover,
#dictionary #dic-nav li a.current{
	background: #c3d7e9;
	color: #fff;
	text-decoration: none;
}
#dictionary #dic-nav li.case a:hover,
#dictionary #dic-nav li.case a.current{
	-moz-border-radius: 4px 0 0 4px;
	-webkit-border-radius: 4px 0 0 4px;
	-ms-border-radius: 4px 0 0 4px;
	-o-border-radius: 4px 0 0 4px;
	border-radius: 4px 0 0 4px;
}

#dic-nav li.seibun a:hover,
#dic-nav li.seibun a.current{
	-moz-border-radius: 0 4px 4px 0;
	-webkit-border-radius: 0 4px 4px 0;
	-ms-border-radius: 0 4px 4px 0;
	-o-border-radius: 0 4px 4px 0;
	border-radius: 0 4px 4px 0;
}


/* ================ index ================= */


/*==== category ====*/
#dictionary .category{
	clear: both;
	margin: 0 0 20px 0;
	padding: 0 0 15px 0;
	background: url("/~/Media/com/learn-more/skin-trouble/dictionary/bg_arrow-bottom.png") center bottom no-repeat;
}

#dictionary .category dl{
	border: 1px solid #c3d7e9;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	-ms-border-radius: 6px;
	-o-border-radius: 6px;
	border-radius: 6px;
	background: #fff;
}
#dictionary .category dt{
	background: #f5f6f9;
	-moz-border-radius: 6px 6px 0 0;
	-webkit-border-radius: 6px 6px 0 0;
	-ms-border-radius: 6px 6px 0 0;
	-o-border-radius: 6px 6px 0 0;
	border-radius: 6px 6px 0 0;
	padding: 27px 0 21px 32px;
	border-bottom:1px solid #c3d7e9 ;
}
#dictionary .category dd ul{
	padding: 32px 20px 22px ;
	overflow: hidden;
}

#dictionary .category dd li{
	float: left;
	margin: 0 20px 10px 0;
}
#dictionary .category dd li.lastchild{
	margin-right: 0;
}


#dictionary .category dd a{
	display: block;
	border: 1px solid #c3d7e9;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-ms-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
}


#dictionary .category-detail{
	border: 1px solid #c3d7e9;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	-ms-border-radius: 6px;
	-o-border-radius: 6px;
	border-radius: 6px;
	background: #fff;
}
#dictionary .category-detail dl{
	margin: 0 30px;
	padding: 30px 0 0 0;
}

#dictionary .category-detail dt{
	background: #f5f6f9;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-ms-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
	padding: 20px 0 20px 20px;
	border:1px solid #c3d7e9 ;
	font-weight: bold;
	color: #005bac;
	font-size: 14px;
}
#dictionary .category-detail dd{
	margin: 0 0 20px 0;
}
#dictionary .category-detail dd ul{
	padding: 15px 10px 5px;
	overflow: hidden;
}

#dictionary .category-detail dd li{
	float: left;
	margin: 0 20px 10px 0;
}


#dictionary .category-detail dd a{
	display: block;
	font-size: 12px;
	background: url("/~/Media/com/learn-more/skin-trouble/common/icon_arrow-right.png") left center no-repeat;
	padding: 3px 0 3px 25px;
}


/* ================ detail ================= */
#dictionary .case-detail{
	clear: both;
	padding: 0 0 15px 0;
	background: url("/skin-trouble/cmn/img/bg_arrow-bottom01.png") center bottom no-repeat;
	margin: 0 0 30px 0;
}

#dictionary .case-detail dl{
	border: 1px solid #c3d7e9;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	-ms-border-radius: 6px;
	-o-border-radius: 6px;
	border-radius: 6px;
	background: #fff;
}


#dictionary .case-detail dt{
	background: #f5f6f9;
	-moz-border-radius: 6px 6px 0 0;
	-webkit-border-radius: 6px 6px 0 0;
	-ms-border-radius: 6px 6px 0 0;
	-o-border-radius: 6px 6px 0 0;
	border-radius: 6px 6px 0 0;

	border-bottom: 1px solid #c3d7e9;
	padding: 27px 0 21px 32px;
	font-size: 18px;
	color: #005aab;
	position: relative;
}
#dictionary .case-detail dt span{
	background: #005aab;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
	border-radius: 4px;
	color: #fff;
	float: left;
	font-size: 11px;
	margin: 0 10px 0 0;
	padding: 5px 10px;


}
#dictionary .case-detail dt a{
	display: block;
	font-size: 12px;
	background: url("/skin-trouble/cmn/img/icon_arrow-right01.png") left center no-repeat;
	padding: 3px 0 3px 25px;
	position: absolute;
	top: 26px;
	right: 32px;
}

#dictionary .case-detail dd{
	margin: 0 32px;
}
#dictionary .case-detail dd.txt{
	font-size: 14px;
	padding: 28px 0;
	line-height: 1.8;
	border-bottom: 1px solid #c3d7e9;
}
#dictionary .case-detail dd.analogy{
	padding: 15px 0 20px 0;
}
#dictionary .case-detail dd.analogy p{
	margin: 0 0 20px 0;
	color: #005aab;
	font-weight: bold;
}

#dictionary .case-detail dd.analogy ul{
	overflow: hidden;
}
#dictionary .case-detail dd.analogy li{
	float: left;
	margin: 0 19px 10px 0;
}
#dictionary .case-detail dd.analogy li a{
	display: block;
	border: 1px solid #c3d7e9;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-ms-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;


}
#dictionary .case-detail dd.analogy li:last-child{
	margin: 0 0 0 0;
}


/* リスト */
#boxDictionary01{
	max-width: 940px;
	width: 100%;
	padding: 0 20px;
	margin: 0 auto;
}
#column_main .h2_basic{
	background: #f4f6f8;
	border-left: 3px solid #0d5daa;
	border-bottom: 1px solid #cdd7e5;
	padding: .7em 0 .5em 1em;
	margin: 0;
	font-size: 1.8rem;
}
#boxDictionary01 .dictionaryLink01{
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 35px;
}
#boxDictionary01 .dictionaryLink01 li{
	margin: 10px 20px 0 0;
}
#boxDictionary01 .dictionaryLink01 li a{
	font-size: 1.6rem;
	line-height: 1.2;
	position: relative;
	padding-left: 20px;
}
#boxDictionary01 .dictionaryLink01 li a::before{
	content: "";
	width: 18px;
	height: 18px;
	background: #005bac;
	border-radius: 50%;
	position: absolute;
	top: 0;
	left: 0;
}
#boxDictionary01 .dictionaryLink01 li a::after{
	content: "";
	vertical-align: middle;
	width: 5px;
	height: 5px;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	position: absolute;
	top: 6px;
	left: 5px;
}

/* ============================== BREAK POINT ==============================
SP Layout
================================= BREAK POINT ============================== */
@media screen and (max-width: 768px) {
	#column_main .h2_basic{
		text-align: left;
	}
	#dictionary {
		margin: 0 auto 30px ;
	}
	#dictionary #dic-nav{
		position: relative;
		top: auto;
		right: auto;
		width: 100%;
		margin: 0 auto 20px;
	}
	#dictionary #dic-nav li{
		width: 50%;
	}

	#dictionary .case-detail{
		width: 90.6%;
		margin: 0 auto 30px ;
	}
	#dictionary .case-detail dt {
		padding: 17px 15px 15px 15px;
	}
	#dictionary .case-detail dd {
		margin: 0 15px;
	}
	#dictionary .category-detail dl{
		margin: 0 15px;
	}

	#dictionary .category dd ul {
		padding: 17px 15px 15px;
	}

	#dictionary .category dd li {
		margin: 0 10px 10px 0;
	}
}