@charset "utf-8";
/* CSS Document */

#contents #service_d_exam .inner .text_area:nth-of-type(2) {
    text-align: center;
    margin: 0 0 20px;
}

#example_lists ul {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    text-align: left;
}

#example_lists ul li {
    position: relative;
    box-sizing: border-box;
    position: relative;
    border: solid 2px #145aa0;
	display: flex;
    flex-direction: column;
}

#example_lists ul li:last-of-type {
    margin-bottom: 14px !important;
}

#example_lists ul li div.image img {
    width: 100%;
    height: auto;
}

#example_lists ul li div.profile {
	margin-top: 20px;
    padding: 0 0 2em;
	display: flex;
    flex-direction: column;
    height: 100%;
}

#example_lists ul li div.profile p {
    margin: 0!important;
}

#example_lists ul li div.profile p.title {
    color: #145aa0;
}

#example_lists ul li div.link {
    display: block;
    box-sizing: border-box;
    width: 100%;
}

#example_lists ul li div.link a {
    display: block;
    margin: auto;
}

#example_lists ul li div.link a p {
    width: 100%;
    margin: auto;
    background-color: #145aa0;
    color: #fff;
    line-height: 36px;
    text-align: center;
    transition: 0.2s all ease-in;
}

#example_lists ul li div.link p.date {
    width: 100%;
    text-align: center;
    line-height: 2;
}

@media only screen and (min-width:1241px){
	
#example_lists ul::after,
#example_lists ul::before {
    content: "";
    display: block;
    width: calc((100% - 36px) / 4);
	order: 1;
}	
	
#example_lists ul li {
    padding: 20px;
	padding-bottom: 5px;
    margin: 0 0 14px;
    width: calc((100% - 36px) / 4);
}	
	
#example_lists ul li div.link a {
    width: calc(100% - 40px);
}
	
}

@media only screen and (max-width:1240px){
	
#example_lists ul li {
    padding: 20px;
	padding-bottom: 5px;
    margin: 0 0 14px;
    width: calc((100% - 24px) / 3);
}	
	
#example_lists ul li div.link a {
    width: calc(100% - 32px);
}
	
}

@media screen and (min-width:1041px){	
	
#contents .contents_area .inner .index p {
    font-size: 1.2rem;
}	
	
#contents .contents_area .inner .text_area {
    margin: 0px 0px 40px 0px;
}	

#contents .contents_area .inner .text_area p {
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 0px;
}
	
}

@media screen and (max-width:1040px){
	
#contents .contents_area .inner .index p {
    font-size: 1.2rem;
}	
	
#example_lists ul li {
    padding: 20px;
	padding-bottom: 5px;
    width: calc((100% - 12px) / 2);
}		
	
#contents .contents_area .inner .text_area {
    margin: 0px 0px 35px 0px;
}
	
example_lists ul li div.link a {
    width: calc(100% - 24px);
}

#contents .contents_area .inner .text_area p {
    margin: 0px 0px 10px 0px;
}
	
}

@media screen and (max-width:640px){
	
#example_lists ul li {
    width: 100%;
}

#example_lists ul li div.link a {
    width: calc(100% - 24px);
}	
	
}