/*sub0105*/
.yearTop{font-size:1.4rem; margin:30px 0;padding: 35px 328px 35px 35px;background: url(/images/doggeonoin/historyImg.jpg) no-repeat 100% center; background-size: auto 100%; background-color: #003964;border: 20px solid #003964;}
.yearTop p{color:#fff !important;}
.yearTop p:nth-child(1){font-size:0.9em;font-weight:500;}
.yearTop p:nth-child(2){font-size:1.1em; margin: 5px 0 30px 0;font-weight: 900;}
.yearTop p:nth-child(3){font-size:1rem;opacity:0.9;}
.yearTop p strong{font-weight: 900;}
.year>li{display:flex; margin-bottom:40px;}
.year>li>h4{font-size:3.0em; width:170px; color:#085690; border-top: 3px solid #085690; padding-top:15px;font-weight: 900;text-align: center;}
.monWrap{width:calc(100% - 200px);}
.mon>li{display:flex; margin-left:0; border-top:1px dashed #e5e5e5; padding: 10px 30px;}
.mon:first-child{border-top:1px solid #cdcdcd;}
.mon:first-child>li{border-top:0;}
.mon>li p{font-weight: bold;  margin-top:5px;   font-size: 1.1em;    width: 120px;}
.mon>li ol{width: calc(100% - 90px);background-color: #f6f6f6;border-radius:5px;padding: 5px 0;}
.yearList li{position: relative;    padding-left: 13px;    font-size: 1.0em;  padding: 5px 15px 5px 23px;color: #6a6a6a;}
.yearList li:after{content: ''; width: 3px; height: 3px;border-radius: 100%;background: #333;position: absolute;left: 15px;top: 15px;}
	/* add */
	#historyTab > ul{display: table;table-layout: fixed;position: relative;width: 85%;margin: 45px auto 70px auto;}
    #historyTab > ul:before{content: "";display: block;position: absolute;bottom: 7px;left: 0;width: 100%;height: 0;border-bottom: 2px solid #e2e2e2;}
    #historyTab > ul > li{display: table-cell;width: 33.333%;height: 100%;min-height: 50px;line-height: 1.2 !important;text-align: center;position: relative;}
    #historyTab > ul > li:after{content:"";width:1px;height:15px;display:block;background-color:#e2e2e2;position:absolute;top:0;right:0;}
    #historyTab > ul > li:last-child:after{display:none;}
    #historyTab > ul > li > a{width: 100%;padding: 0 13px;font-size: 16px;text-overflow: ellipsis;overflow: hidden;transition: color .28s ease; position: relative;display: block;vertical-align: top;height: 100%;padding-bottom: 20px;}
    #historyTab > ul > li.chk > a{background-color: transparent;color: #085690;font-weight: 700;}
    #historyTab > ul > li > a:after{content: "";display: block;position: absolute;bottom: 0px;left: 50%;margin-left: -7px;width: 14px;height: 14px;border: 3px solid #085690;border-radius: 7px;background: #fff;box-sizing: border-box;}
    #historyTab > ul > li.chk > a:after {background: #085690;}
    
    
    
/* design_type01 */
.color_type01{background-color:#336182;}
.color_type02{background-color:#3385C0;}
.color_type03{background-color:#517A97;}
.color_type04{background-color:#5D97C0;}
.color_type05{background-color:#3379AB;}
.color_type06{background-color:#4398D4;}

.color_type01:after{border:3px solid #336182;}
.color_type02:after{border:3px solid #3385C0;}
.color_type03:after{border:3px solid #517A97;}
.color_type04:after{border:3px solid #5D97C0;}
.color_type05:after{border:3px solid #3379AB;}
.color_type06:after{border:3px solid #4398D4;}

.height80 > li{height: 80px;}
.design_type01 > li{display: flex;justify-content: space-between;align-items: flex-start;margin-top: 15px;font-size: 1.1em;}

.design_type01 > li > h4:before{content: "";/* width: calc(100% - 2px);height: calc(100% - 2px); */width:100%;height:100%;border-radius: 18px;position: absolute;top:0;left:0;/* top: 1px;left: 1px; background-color: rgba(255,255,255,0.2);border: 10px solid #fff;box-sizing: border-box; */}
.design_type01 > li > h4:after{content:"";width:12px;height:12px;border-radius:50%;display:block;position: absolute;right:-36px;top:calc(50% - 6px);background-color:#fff;box-sizing: border-box;z-index:9;}
.design_type01 > li > h4{display: flex;justify-content: center;align-items: center;width: 250px;height: 100%;border-radius: 40px;color:#fff;position:relative;top:0;left:0;font-size: 1.12em;letter-spacing: -0.5px;font-weight: 700;}

.design_type01 > li > div:before{
	content:"";
	width:30px;
	border-bottom:2px dotted #ddd; position: absolute;left: -30px;top: calc(50% - 1.5px);}
.design_type01 > li > div{
	width: calc(100% - 280px);
	height: 100%;
	background-color: #fafafa;border: 1px solid rgba(0,0,0,0.07);
	border-radius: 10px
	;padding: 15px 30px;
	word-break: keep-all;position:relative;top:0;left:0;font-size:1.1em;}

    
    
    
	
/******************************* mobile(under 768px) *******************************/
@media screen and (max-width:768px) {    
    	
	.year>li{flex-wrap:wrap;}
	.monWrap{width:100%; margin-top:20px;}
	.year>li>h4{width:auto;}
	.mon>li{margin-left:0; }
	.yearList li{word-break: keep-all;}
	.mon>li p{flex:1;}
	.mon>li ol.yearList{flex:3;}
	
}