/*top*/
div.row p{margin-bottom:10px;}

/* eye
----------------------------------------------------------------------------------------------------*/
#eye{position: relative;}
.carousel-indicators li {width: 10px; height: 10px;border-radius: 100%;}
.carousel-indicators li.active {background-color:#004098;}

/* layout
----------------------------------------------------------------------------------------------------*/
main{overflow: hidden;}
#index section h2{text-align:center; margin-bottom:0.8em; font-weight:600;font-size: 1.8rem; letter-spacing:0.1em;}
#index section h2 > div{display:inline-block; border-bottom:#103d9b 5px solid; padding:0 .5em .2em;}

@media (min-width:576px) {
    #index section h2{font-size: 2rem;}
}

div.wrap{
    padding-bottom:3em;
    background-color:transparent;
}
#index section:first-child div.wrap{padding-top: 3em;}
@media (min-width:992px) {
div.wrap{padding-bottom: 60px;}
#index section:first-child div.wrap{padding-top: 60px;}
}
section.diagonal{padding:2em 0 3em ;}
section.diagonal > div{
	width: 100%;
	background-color:#f4f7fc;
     padding-top:3em ;
     padding-bottom:3em ;
    transform: skew(0deg, -3deg);
}
  
#index .btn{padding:.3em 2.5em .3em 1em; position: relative;}
#index .btn:after{content:'\f105'; position: absolute; display:inline-flex; justify-content:center; align-items:center; width:20px; height:20px; background-color:#ffffff; margin:auto; right:.6em; border-radius: 100%; top:0; bottom:0; color:#777777; font-weight:900; font-family: "Font Awesome 5 Free"; letter-spacing:0; font-size:1.05rem;}
#index .btn-red:after{color:#fe0000;}
#index .btn-red:hover:after{background-color:#fe0000; color:#ffffff;}

.movielist{display:flex; justify-content:center; flex-wrap:wrap;}
.movielist > div{flex-basis:calc(50% - 20px); max-width:calc(50% - 20px); margin:5px 10px;}
@media (min-width:992px) {
.movielist{flex-wrap:nowrap;}
.movielist > div{flex-basis:calc(25% - 20px); max-width:calc(25% - 20px); margin:10px;}
}

#index .policy h3{
    font-weight: 600;
    text-align: center;
    color: #024EA2;
    font-size: 1.7rem;
    letter-spacing: normal;
    margin-bottom: 1em;}
#index .policy h3 > strong{
    position: relative;
    display: inline-block;
    padding: 0 30px;
    line-height: 1.4;
  }
  #index .policy h3 > strong::before,#index .policy h3 > strong::after{
    content: '';
    position: absolute;
    top: 50%;
    display: inline-block;
    width: 45px;
    height: 2px;
    background-color: #024EA2;
  }
  #index .policy h3 > strong::before{
    -moz-transform: rotate(65deg);
    -webkit-transform: rotate(65deg);
    -ms-transform: rotate(65deg);
    transform: rotate(65deg);
    left:-10px;
  }
  #index .policy h3 > strong::after{
    -moz-transform: rotate(-65deg);
    -webkit-transform: rotate(-65deg);
    -ms-transform: rotate(-65deg);
    transform: rotate(-65deg);
    right:-10px;
  }
  #index .policy .text{position: relative;}
  #index .policy .text::before{
    -moz-transform: rotate(65deg);
    -webkit-transform: rotate(65deg);
    -ms-transform: rotate(65deg);
    transform: rotate(65deg);
    left:-10px;
  }
  #index .policy .text::after{
    -moz-transform: rotate(-65deg);
    -webkit-transform: rotate(-65deg);
    -ms-transform: rotate(-65deg);
    transform: rotate(-65deg);
    right:-10px;
  }


#news .topics{display:block; }
#news .topics > *{min-height:0;}
#news .topics > a{display:flex; padding:10px; border:1px solid #bfbfbf; border-bottom:none; flex-direction:row ; flex: 1; max-width:100%; box-sizing:border-box;}
#news .topics > a:last-child{border-bottom:2px solid #bfbfbf;;}
#news .topics > a > div:first-child{flex-basis:50%; max-width:50%; min-height: 0%;}
#news .topics > a > div.text{display:flex; flex-direction: column; margin-left:10px;flex:1;}
#news .topics h3{margin-top:5px; font-weight:bold;}
#news .topics > a img{margin-bottom:0px;}
#news .topics p.cat{margin:auto 0 0;}
#news .topics p.cat span{font-weight:normal; background-color:#003592; color:#ffffff;}
@media (min-width: 768px) {
}
@media (min-width:992px) {
    #news .topics{display:flex; flex-direction:row;}
    #news .topics > a{display:block; flex-direction:column; flex:1; border-right:none; border-bottom:2px solid #bfbfbf;}
    #news .topics > a:last-child{border-right:2px solid #bfbfbf;}
    #news .topics > a > div:first-child{max-width:100%;}
    #news .topics > a img{margin-bottom:10px;}
    #news .topics > a > div.text{margin-left:0;}
}



#principle .pp{flex-direction: column;}
#principle .pp a{display:flex; position: relative; overflow:hidden; flex:1;}
#principle .pp a div.bg{display:flex; min-height:350px; width:100%;
    transition: all 0.3s ease-out;
	transform: matrix3d(
		1, 0, 0, 0,
		0, 1, 0, 0,
		0, 0, 1, 0,
		0, 0, 0, 1
	);
    will-change: transform;
}
#principle .pp a:first-child div.bg{background:url(/wp-content/themes/aplan/img/policy01.png) center center no-repeat; background-size:cover;}
#principle .pp a:last-child div.bg{background:url(/wp-content/themes/aplan/img/policy02.png) center center no-repeat; background-size:cover;}
#principle .pp a:hover div.bg{
        transform: matrix3d(
            1, 0, 0, 0,
            0, 1, 0, 0,
            0, 0, 1, 0,
            0, 0, 0, 0.9
        );}
#principle .pp a div.text{display:flex; flex-grow: 1; z-index:2; background-color:rgba(33, 33, 33, 0.2);position: absolute;  width:100%; height:100%; -webkit-transition: all .3s; transition: all .3s;}
#principle .pp a div.text > div{display:flex; flex-direction: column; align-items:center; color:#ffffff !important; font-size:1.1rem; text-align:center; flex-grow: 1;position: absolute; left:0; right:0; bottom:40px; padding:0 15px; }
#principle .pp a:hover div.text{background-color:rgba(33, 33, 33, 0.5);}
#principle .pp a strong{display:block; font-weight:bold; font-size:1.5rem;}
#principle .pp a span{display:table; border:1px solid #ffffff; font-weight:500; -webkit-transition: all .3s; transition: all .3s; font-size:1rem; margin:auto 0 0; width:auto;}
#principle .pp a:hover span{background-color:#ffffff; color:#777777;}
#principle .pp a:hover span:after{background-color:#777777; color:#ffffff;}
@media (min-width:576px) {
    #principle .pp a div.text > div{top:45%;}
}
@media (min-width:992px) {
    #principle .pp{display:flex; justify-content:center; flex-direction:row;}
}
#principle .status{text-align:center;}
#principle .status h2,#policy h3{letter-spacing:.2em; margin-bottom:.7em;}
#principle .status h2 > small{margin:8px 0 0; font-size:50%;}

#policy h3 > small{margin:0 0 5px; letter-spacing: 0;}
#policy div.row img{width:210px;}

#principle .status div.row p + strong,#policy div.row p + strong{font-size:1.5rem;}
#policy{background:url(/wp-content/themes/aplan/img/back_01.png) left top no-repeat; background-size:contain;}

@media (min-width:576px) {
    #policy h3 > small{letter-spacing: inherit;}
}


section.diagonal > div > div{ transform: skew(0deg, 3deg);}

#profile dl,#profile dl *{margin-bottom:0; font-weight:normal;}
#profile dl > div{display:flex;}
#profile dt{margin-right:10px; width:50px;}
#profile dd{flex:1;}
#profile div.row > div.profimg{display:flex; align-items:flex-end;}
#profile div.row > div.profimg img{max-width:80%; width:100%;}
@media(min-width:768px){
    #profile div.row > div.profimg img{max-width:90%;}
    #profile dt{width:60px;}
}
