/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* SITE +++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
html  { }
body  { min-width:360px; }
#site { background:var(--colo-site-01); }
#head { background:var(--colo-head-01); position:relative; z-index:4; padding:16px 0; }
#main { background:var(--colo-main-01); }
#foot { background:var(--colo-foot-01); overflow:hidden; }

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* CONT +++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.home { background:var(--colo-home-01); padding-bottom:var(--spac); }
.page { background:var(--colo-page-01); padding:var(--spac) 0; }
.boxx { width:100%; max-width:1200px; margin:auto; box-sizing:border-box; padding-left:var(--spac); padding-right:var(--spac); }
.secc { }
.cont { flex:4 480px; margin:0 auto; }
.side { flex:1 200px; }
.view { flex:1 240px; box-sizing:border-box; }

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* HEAD +++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.logo { display:flex; position:relative; z-index:2; }
.logo img { width:auto; height:48px; margin-left:-4px; }
.cole span { font-size:11px; color:var(--colo-dark-02); }

.noti .soci-port .soci .icon { background-color:var(--colo-00); }
.noti .soci-port .soci .icon:hover { background-color:var(--colo-comp-02); }
.noti .cole span { color:var(--colo-00); }
.noti .cole img { content:url("imag/corp/logo-cat-noti.svg"); }
.noti .logo img { content:url("imag/corp/logo-noti.svg"); height:40px;  }
.noti #head { padding:20px 0; background:url(imag/corp/head-bckg.jpg); background-position:center; background-repeat:no-repeat; background-size:cover; }

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* FOOT +++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
#foot .boxx { background:var(--colo-foot-01); }
.foot-boxx { padding:40px 0; }
.foot-logo > img { height:36px; margin:0; }
#foot .cole span { color:var(--colo-foot-04); font-size:13px }
#foot .cole { opacity:0.6; }
.foot-text > img { height:30px; margin:5px 1px; }
.foot-boxx h3 { color:var(--colo-foot-06); display:none; }
.foot-text p { color:var(--colo-foot-05); font-size:15px; margin:-4px 0 0 0; } 
.foot-text a { color:var(--colo-foot-04); } 
.foot-dere { padding-top:20px; border-top:1px solid var(--colo-foot-02); }
.foot-dere p { color:var(--colo-foot-04); letter-spacing:1px; font-size:11px; margin:0; }

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* SECC +++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.gapp .imag-secc:not(:last-child) { margin-bottom:calc(var(--spac)*-1); }
.imag-secc { position:relative; background:var(--colo-prim-03); }
.imag-secc .imag { position:relative; overflow:hidden; margin:0; }
.imag-secc .imag img { position:absolute; z-index:-1; }
.imag-secc .filt01 {  }
.titu-secc { position:relative; font-family:'Merriweather', sans-serif; font-size:21px; text-align:center; background:rgba(0,0,0,0.1); border-bottom:1px solid rgba(255,255,255,0.1); padding:10px 0; font-weight:700; color:rgba(255,255,255,0.4); }

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* WIDG +++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.side .side-boxx .boxx { width:auto; padding:0; }

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* BUSC +++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.busc {  width:100%; }
.busc input, .busc select { background:none; box-sizing:border-box; width:100%; font-size:14px; padding:4px 28px 4px 8px; border:1px solid var(--colo-ligh-03); }
.boto-busc { display:block; height:18px; width:18px; margin-left:-22px; background:var(--colo-dark-01); -webkit-mask:url(../skin/imag/nave/busc.svg); mask:url(../skin/imag/nave/busc.svg); -webkit-mask-size:100% 100%; mask-size:100% 100%; }

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* ELEM +++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.imag { overflow:hidden; }
.imag > img { height:100%; width:100%; object-fit:cover; }
.page .cont .imag img { max-height:360px; }
.page .cont .text img { max-width:100%; height:auto; }
.satu img { filter:saturate(200%); -webkit-filter:saturate(200%); }
.gray img { filter:grayscale(100%); -webkit-filter:grayscale(100%); }
.cntr img { filter:contrast(200%); -webkit-filter:contrast(200%); }
.icon { cursor:pointer; -webkit-mask:no-repeat center; mask:no-repeat center; }
.cont .imag { height:auto; }
.text .imag { margin-bottom:40px; }

.subr { width:100%; height:1px; margin:12px 0; }
.op00 { opacity:0.00; }
.op25 { opacity:0.25; }
.op50 { opacity:0.50; }
.op75 { opacity:0.75; }

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* ANIM +++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.tran, .menu-item, .imag img, .sub-menu, .sub-menu li, .menu a { -webkit-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -moz-transition:all 0.3s ease-out; -ms-transition:all 0.3s ease-out; transition:all 0.3s ease-out; }
/* ---------------------------------------------------------- */
.parp { animation: parp 1s ease-out 0s infinite alternate; }
@keyframes parp { 0% { text-shadow:0px 0px 12px red } 100% { text-shadow:none } }
/* ---------------------------------------------------------- */
.rota { animation: rota 1s ease-in-out 2s infinite alternate; }
@keyframes rota { from{transform:rotate(-20deg)} to {transform:rotate(30deg)} }
/* ---------------------------------------------------------- */
.marq { animation:marq 8s infinite normal linear 2s; }
@keyframes marq { 0% {transform:translatex(0); } 100% { transform:translatex(-100%); } }