.cp_tab *, .cp_tab *:before, .cp_tab *:after {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}
.cp_tab {

	margin: 1em auto;
}
.cp_tab > input[type='radio'] {
	margin: 0;
	padding: 0;
	border: none;
	border-radius: 0;
	outline: none;
	background: none;
	-webkit-appearance: none;
	        appearance: none;
	display: none;
}
.cp_tab .cp_tabpanel {
	display: none;
}
.cp_tab > input:first-child:checked ~ .cp_tabpanels > .cp_tabpanel:first-child,
.cp_tab > input:nth-child(3):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(2),
.cp_tab > input:nth-child(5):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(3),
.cp_tab > input:nth-child(7):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(4),
.cp_tab > input:nth-child(9):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(5),
.cp_tab > input:nth-child(11):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(6) {
	display: block;
}
.cp_tab > label {
    width: 280px;
    height: 120px; 
    text-align: center;
	position: relative;
	display: inline-block;
    font-weight: bold;
	padding: 15px;
    padding-top: 80px;
    color: #fff;
	cursor: pointer;
	border: 1px solid #003764 ;
	border-bottom: 0;
}

.tab-icon1{background: #003764 url("../images_re/assessment_tab_w.png")center top 12px no-repeat; margin-right: 5px;}
.tab-icon2{background: #003764 url("../images_re/profile_tab_w.png")center top 12px no-repeat; margin-right: 5px;}
.tab-icon3{background: #003764 url("../images_re/facilitation_tab_w.png")center top 12px no-repeat; margin-right: 5px;}
.tab-icon4{background: #003764 url("../images_re/certification_tab_w.png")center top 12px no-repeat;}

/*.cp_tab > label:after{content: ''; display: inline-block; background-image:url("../images_re/assessment_tab_w.png");}*/

.cp_tab > label:hover,
.cp_tab > input:focus + label {
	opacity: 0.6; 
}
.cp_tab > input:checked + label {
    z-index: 1;
    color: #003764;
    background: #fff;
	margin-bottom: -1px;
	border-color: #003764;
	border-bottom: 1px solid #ffffff;/*�w�i�F�Ɠ���*/
}
.cp_tab .cp_tabpanel {
    position: relative;
	padding: 30px;
	border: 1px solid #003764;
}

.tab-txt{ position: absolute; top: 50%; -webkit-transform : translateY(-50%); transform : translateY(-50%); width: 50%; float: left; }

.cp_tab > input:checked + .tab-icon1{ height: 121px; background: #fff url("../images_re/assessment_tab_b.png")center top 12px no-repeat;}
.cp_tab > input:checked + .tab-icon2{ height: 121px; background: #fff url("../images_re/profile_tab_b.png")center top 12px no-repeat;}
.cp_tab > input:checked + .tab-icon3{ height: 121px; background: #fff url("../images_re/facilitation_tab_b.png")center top 12px no-repeat;}
.cp_tab > input:checked + .tab-icon4{ height: 121px; background: #fff url("../images_re/certification_tab_b.png")center top 12px no-repeat;}

/* tab-flex **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.tab-flex{ text-align: center; width: 230px; }
.tab-flex:nth-child(1){ border-bottom: solid 3px #1daf4c; margin-bottom:30px;  }
.tab-flex:nth-child(2){ margin:  0 15px 0 30px; border-bottom: solid 3px #b2282f; margin-bottom:30px; }
.tab-flex:nth-child(3){ margin: 0 30px 0 15px; border-bottom: solid 3px #2291cd; margin-bottom:30px; }
.tab-flex:nth-child(4){ border-bottom: solid 3px #f3cc23; margin-bottom:30px; }



@media (max-width: 768px) {
	.cp_tab {
		width: 100%;
		font-size: 0.8em;
	}
    
    .cp_tab > label {
        width: 23%;
        height: 50px; 
        text-align: center;
        position: relative;
        display: inline-block;
        font-weight: bold;
        padding: 0;
        color: #fff;
        cursor: pointer;
        border: 1px solid #003764 ;
        border-bottom: 0;
    }
    
    .tab-icon1{background: #003764;}
    .tab-icon2{background: #003764;}
    .tab-icon3{background: #003764;}
    .tab-icon4{background: #003764;}
    
    .cp_tab > input:checked + .tab-icon1{ height: 51px; background: none;}
    .cp_tab > input:checked + .tab-icon2{ height: 51px; background: none;}
    .cp_tab > input:checked + .tab-icon3{ height: 51px; background: none;}
    .cp_tab > input:checked + .tab-icon4{ height: 51px; background: none;}

    
.cp_tab .cp_tabpanel {
	padding: 30px;
	border: 1px solid #003764;
}

.tab-txt{ position: static; margin-top: 60px; margin-bottom: -20px; width: 100%; float: none; }

    /* tab-flex **********
    ///////////////////////////////////////////////////////////////////////////////////////////////*/
    .tab-flex{ text-align: center; width: 100%; padding: 0 20px; }

    
}