/*///----- highlight -----///*/
#highlightBox h2{background-image:url(../img/highlight/title.png) ;background-repeat:no-repeat;}
#highlightBox h2 .midashi{position:relative;display:block;}
#highlightBox h2 small{position: absolute;bottom: 0px; right: 5px;font-size:120%;line-height:100%;font-weight:bold;color:#004561;transform: rotate(.03deg);}

	#highlightBox h3,#highlightBox h4,#highlightBox h5{color: #004561;}
	#highlightBox .innerbox{border-top:solid 1px #004561;}

#highlightBox .link_bt{margin:0 auto;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-pack:justify;
    -moz-box-pack:justify;
    -webkit-flex-pack:justify;
    -moz-flex-pack:justify;
    -ms-flex-pack:justify;
    -webkit-justify-content:space-between;
    -moz-justify-content:space-between;
    justify-content:space-between;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
}

#highlightBox .link_bt a{background: #004561;color:#e5d3a4;text-decoration:none;}
#highlightBox .link_bt a:hover{background:#e5d3a4;color:#004561;}

#highlightBox .photo_tate .lazy,
#highlightBox .photo_yoko .lazy{display:block;background-position:center center;background-color:#f4f1e4;margin:0 auto;}


#highlightBox .photo_tate,
#highlightBox .photo_yoko{margin:2em auto;}



/*
#highlightBox .photo_tate,
#highlightBox .photo_yoko
{
    margin:2em auto;
    position: relative;
    padding: 0.5em 1.2em;
    border-top: solid 1px #004561;
    border-bottom: solid 1px #004561;
}

#highlightBox .photo_tate:before, #highlightBox .photo_tate:after,
#highlightBox .photo_yoko:before, #highlightBox .photo_yoko:after
{
    content: '';
    position: absolute;
    top: -10px;
    width: 1px;
    height: -webkit-calc(100% + 20px);
    height: calc(100% + 20px);
    background-color: black;
}

#highlightBox .photo_tate:before,
#highlightBox .photo_yoko:before {left: 10px;}
#highlightBox .photo_tate:after,
#highlightBox .photo_yoko:after {right: 10px;}
#highlightBox .photo_tate p,
#highlightBox .photo_yoko p {
    margin: 0; 
    padding: 0;
}
*/

@media all and (min-width: 768px) {
#highlightBox {width: 590px;padding:30px 0;}
#highlightBox h2{width:580px;height:35px;margin-bottom:20px;padding-bottom:10px;background-position:20px 0;}
#highlightBox h2 .midashi{width:580px;height:35px;border-left:solid 10px #004561;}

	#highlightBox h3{font-size:160%;line-height:120%;margin-bottom:10px;}
	#highlightBox h4{font-size:145%;line-height:120%;margin-bottom:10px;}
	#highlightBox h5{font-size:120%;margin-bottom:20px;}
	#highlightBox .innerbox{padding:20px 0;}	
	#highlightBox .txt{margin:10px auto;font-size:100%;}
	#highlightBox .txt:last-child{margin-bottom:0;}
	#highlightBox small{display:inline-block;font-size:80%;line-height:120%;}

#highlightBox .link_bt{width:90%;}
#highlightBox .link_bt li{font-size:120%;}
#highlightBox .link_bt a{padding:5px 10px;}

#highlightBox .photo_tate .lazy{width:300px;height:400px;margin:0 auto;}
#highlightBox .photo_yoko .lazy{width:400px;height:300px;margin:0 auto;}

#highlightBox .photo_tate{width:300px;}
#highlightBox .photo_yoko{width:400px;}
}

@media all and (max-width: 767px) {
#highlightBox{width:90%;margin:0 auto;padding:2em 0 1em;}
#highlightBox h2 {width:100%;height:30px;margin-bottom:.5em;padding-bottom:5px;background-position:10px 0;background-size:contain;}
#highlightBox h2 .midashi{width:100%;height:25px;margin-bottom:1em;border-left:solid 5px #004561;}

	#highlightBox h3{font-size:130%;margin-bottom:.5em}
	#highlightBox h4{font-size:130%;margin-bottom:.5em;}
	#highlightBox h5{font-size:110%;margin-bottom:.5em;}
	#highlightBox .innerbox{padding:1em 0;}	
	#highlightBox .txt{margin:1em auto;}
	#highlightBox .txt:last-child{margin-bottom:0;}
	#highlightBox small{display:inline-block;font-size:70%;line-height:120%;}

#highlightBox .link_bt{width:100%;}
#highlightBox .link_bt a{padding:.2em .5em;}

#highlightBox .photo_tate .lazy{width:100%;height:0; padding-top:130%;}
#highlightBox .photo_yoko .lazy{width:100%;height:0; padding-top:65%;}

#highlightBox .photo_tate{width:60%;}
#highlightBox .photo_yoko{width:80%;}
}