@charset "UTF-8";

@media all and (min-width: 769px) {
	
	h3 {
		font-size: 24px;
		font-weight: 600;
		line-height: 1.4;
		padding-left: 32px;
		border-left: 10px solid #4C5870;
		margin: 0 0 3rem 2%;
	}	
	
	body{position: relative;}
	
	.sp {
		display:none;
	}
	
	.outlinePage .aboutLeadSec{
		min-width: 769px;
	}
	
	.outlinePage .aboutLeadSec .wrap {
		max-width: 1236px;
		width: 100%;
		margin: 0 auto;
		padding: 0 40px;
	}

	.outlinePage .aboutLeadSec .wrap .title {
		text-align: center;
		width: 517px;
		padding: 18px 0;
		border-top: 1px solid #4C5870;
		border-bottom: 1px solid #4C5870;
		margin: 0 auto 76px;
	}
	
	.outlinePage .aboutLeadSec .wrap .title .main {
		font-size: 24px;
		line-height: 1.1;
		margin-bottom: 0;
	}
	
	.outlinePage .aboutLeadSec .wrap p.mediaTitle{
		min-height: 7.7em;
		margin: 1 1 1.5rem 0;
		padding: 1em;
		box-shadow: 0 1px 0 0 #d8d8d8;
		border: none;
		font-size: 16px;
		background: #F4F4F4;
	}
	
	.outlinePage .aboutLeadSec .wrap p.mediaTitle a {
    display: inline-block;
		text-decoration: underline;
}

	/*YouTube*/
	.modalWrap{
		display: flex;
		flex-wrap: wrap;
		justify-content: start;
		align-items: flex-start;
		margin: 0 0 50px 0;
	}

	.modalBox{
		max-width: 30%;
		margin: 1em 1.5em 2em ;
		margin: 1% 2% 2% ;
	}
	
	.modalBox:nth-child(3n){
		max-width: 30%;
		margin: 1em 0 2em 1.2em;
		margin: 1% 0 2% 2%;
	}
	
	.modalBox img{
		width: 100%;
	}

	.modalBtn {
		display: flex;
		box-sizing: border-box;
		transition-duration: 0.3s;
		flex-direction: column;
		flex-grow: 1
	}
	
	/*brightcove*/
	
	#playerLightbox {
		overflow: hidden;
		position: fixed;
		top: 0;
		z-index: 20;
	}
	
	/* show the player */
	.playerShow {
		padding: 100%;
		position: absolute;
		top: 50%!important;
		left: 50%;
		transform: translate(-50%,-50%);
		background: rgba(0,0,0,0.9);
	}
	
	/* hide the player */
	.playerHide {
		width: 0;
		height: 0;
		padding: 0;
	}
	
	/* style the close button for the lightbox player */
	.playerClose {
		text-align: right;
		margin-top: 15px;
		text-decoration: none;
		color: #fff;
		width: 104%;
		cursor: pointer;
	}

	.playerClose img{
		width: 10%;
	}
	
	.vjs-dock-text {
		display: none !important;
	}

	/* style the video poster image */
	#container {
		position: relative;
		background-color: #090909;
		width: 100%;
		height: auto;
		padding: 0px;
		border: 1px #999 solid;
		cursor: pointer;
	}

	.bc-player-default_default-index-0 {
		width: 80em!important;
		height: 46em!important;
	}
	
	.caption {
		margin-top: .5em;
		text-align: left;
		font-size: .7em!important;
		line-height: 1.5!important;
	}
	
	/*
	.outlinePage .aboutLeadSec .wrap p.douga {
		width: 980px;
		height: 551px;
	}
	.outlinePage .aboutLeadSec .wrap p.douga iframe {
		width: 100%;
		height: 100%;
	}
	
	.detail {
		margin-bottom: 10%;
	}
	*/

}


@media screen and (max-width: 768px) {

      h3 {
        font-size: 16px;
        font-weight: 600;
        line-height: 1.4;
        padding-left: 16px;
        border-left: 5px solid #4C5870;
        margin-bottom: 0; 
	}	
	
/*	#gNav{display: none!important;}*/

	.outlinePage .aboutLeadSec .wrap {
		width: auto!important;
		padding: 0 20px;
	}

	.outlinePage .aboutLeadSec .wrap .title {
		text-align: center;
		width: 100%;
		padding: 15px 0;
		border-top: 1px solid #4C5870;
		border-bottom: 1px solid #4C5870;
		margin: 0 auto 4rem;
		font-size: 16px;
		line-height: 1.1;
	}
	
	.outlinePage .aboutLeadSec .wrap p.mediaTitle{
		min-height: 7em;
		margin: 1 1 1.5rem 0;
		padding: 1em;
		box-shadow: 0 1px 0 0 #d8d8d8;
		border: none;
		font-size: 16px;
		background: #F4F4F4;
	}
	
	.outlinePage .aboutLeadSec .wrap .title .main {
		margin-bottom: 0; 
	}

	/*YouTube*/
	.modalWrap{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin: 0 0 50px 0;
	}
	
	.modalBox{
		width: 48%;
		margin: 1em 0;
	}

	.modalBox:nth-child(even){
		width: 48%;
		margin: 1em 0 ;
	}

	.modalBox img{
		width: 100%;
	}

	/*brightcove*/
	#playerLightbox {
		overflow: hidden;
		position: fixed;
		top: 0;
		z-index: 20;
	}
	
	/* show the player */
	.playerShow {
		padding: 100%;
		position: absolute;
		top: 50%!important;
		left: 50%;
		transform: translate(-50%,-50%);
		background: rgba(0,0,0,0.9);
	}
	
	/* hide the player */
	.playerHide {
		width: 0;
		height: 0;
		padding: 0;
	}
	
	/* style the close button for the lightbox player */
	.playerClose {
		text-align: right;
		margin-top: 15px;
		text-decoration: none;
		color: #fff;
		width: 109%;
		cursor: pointer;
	}

	.playerClose img{
		width: 20%;
	}

	/* style the video poster image */
	#container {
		position: relative;
		background-color: #090909;
		width: 100%;
		height: auto;
		padding: 0px;
		border: 1px #999 solid;
		cursor: pointer;
	}

	.bc-player-default_default-index-0 {
		width: 80vw!important;
		height: 34vh!important;
	}
	
	.caption {
		margin-top: .5em;
		text-align: left;
		font-size: .4em!important;
		line-height: 1.5!important;
	}
	
	.vjs-dock-text {
		display: none !important;
	}

/*
	.outlinePage .aboutLeadSec .wrap p.douga {
		height: 49vw;
	}
	.outlinePage .aboutLeadSec .wrap p.douga iframe {
		width: 100%;
		height: 100%;
	}
	
	.detail {
		margin-bottom: 10%;
	}
*/

}


@media screen and (max-width: 414px) {

	.outlinePage .aboutLeadSec .wrap p.mediaTitle{
		min-height: auto;
		font-size: 13px;
	}

	.modalBox{
		width: 100%;
		margin: 1em 0 0;
	}

	.modalBox:nth-child(even),
	.modalBox:nth-child(3n){
		width: 100%;
		margin: 1em 0 0;
	}
	
	/* style the close button for the lightbox player */
	.playerClose {
		margin-top: 15px;
		text-decoration: none;
		color: #fff;
		width: 115%;
		cursor: pointer;
	}

	.playerClose img{
		width: 30%;
	}

	.bc-player-default_default-index-0 {
		width: 90vw!important;
		height: 30vh!important;
	}
	
	.caption {
		font-size: .4em!important;
	}

}



