@charset "utf-8";
/* FONTS */
	@import url('https://fonts.googleapis.com/css?family=Playfair+Display:400,400i,700,700i,900,900i&display=swap&subset=latin-ext');
    @import url('https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800,900&display=swap&subset=latin-ext');
    /*font-family: 'Playfair Display', serif;
    font-family: 'Quicksand', sans-serif;*/
/* RESET */
    *{margin:0px; padding:0px; border:none; outline:none; list-style:none; text-decoration:none; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; -o-box-sizing:border-box;}
    *{font-family:'Montserrat', sans-serif;}
    code, kbd, pre, samp{font-family:'Montserrat', sans-serif !important;}
    *:before, *:after{box-sizing:inherit;}
    a, button{transition:0.3s;}
    body{background:#FFF; padding-top:97px;}
    .page-section{opacity:0;}
/* INTRO */
    .intro{width:100%; height:100%; position:fixed; left:0px; top:0px; z-index:10001; display:flex; flex-wrap:nowrap; justify-content:center; align-items:center; background:#FFF;}
    .introimg{width:100px; -moz-transition:all 2.5s linear 0s; -ms-transition:all 2.5s linear 0s; -o-transition:all 2.5s linear 0s; transition:all 2.5s linear 0s;}
    .introimg.big{width:461px;}
/* HEADER */
	header{width:100%; padding-top:3px; display:flex; flex-wrap:nowrap; justify-content:space-between; align-content:center; position:fixed; left:0px; top:0px; z-index:1000; border-bottom:solid 1px #ECECEC; background:#FFF;}
	header .logo{height:72px; margin:.75rem 2rem;}
	header .logo a img{height:72px;}
	header .menu{display:flex; flex-wrap:nowrap; align-items:flex-end;}
	header .menu li{display:flex; flex-wrap:nowrap;}
    header .menu li a{font-size:1rem; padding:1.5rem 2.5rem; font-weight:600; border-bottom:solid .25rem #FFF; color:#585858;}
    header .menu li a:hover{color:#D1E751;}
    header .menu li a.active{border-bottom:solid .25rem #D1E751;}
	header .lang{display:flex; flex-wrap:nowrap; align-items:center; margin-right:2rem;}
	header .lang a{font-size:1rem; color:#585858; font-weight:700;}
	header .lang a:hover{color:#D1E751;}
    header .lang img{margin-right:.5rem;}
	@media only screen and (max-width:767px){
		header .menu{display:none;}
	}
/* PAGE BANNER */
	.pagebanner{width:100%; height:200px; display:flex; flex-wrap:nowrap; justify-content:center; align-items:center; position:relative; margin:0px auto; background:#FAFAFA;}
    .pagebanner h1{font-weight:300; color:#585858; font-size:3.75rem; text-align:center;}
    .pagebanner h1 b{font-weight:500;}
    @media only screen and (max-width:767px){
        .pagebanner h1{font-size:2.75rem; text-align:center;}
    }
/* ABOUTUS */
	.aboutus-main{width:100%; padding:4.25rem 0px;}
    .aboutus-main .container{max-width:1080px; width:100%; position:relative; margin:0 auto;}
    .aboutus{width:100%; position:relative; padding-left:280px;}
	.aboutus figure{position:absolute; left:0px; top:6rem;}
	.aboutus figure img{float:left;}
	.aboutus .contenttitle{width:100%; display:flex; flex-wrap:wrap;}
    .aboutus .content{width:100%;}
    .aboutus .content p{width:100%; font-size:1.125rem; line-height:2.5rem; color:#585858; margin-bottom:2.5rem; font-weight:300;}
    @media only screen and (max-width:1080px){
        .aboutus-main .container{width:100%; padding:0px 1.25rem;}
    }
    @media only screen and (max-width:768px){
    }
    @media only screen and (max-width:767px){
        .aboutus-main{padding:2rem 0px;}
        .aboutus figure{top:6rem; width:100%;}
        .aboutus figure img{width:100%;}
        .aboutus{padding-left:0px;}
        .aboutus .content p{font-size:1rem; line-height:2rem; margin-bottom:1rem;}
	}
/* DESIGN */
	.design-main{width:100%; padding:4.25rem 0px;}
    .design-main .container{max-width:1220px; position:relative; margin:0 auto;}
	.design{width:100%; display:flex; flex-wrap:nowrap;}
	.design .titlecontentbrand{width:100%; display:flex; flex-wrap:wrap; padding-right:2rem;}
    .design .titlecontentbrand .maintitle{width:100%; display:flex; flex-wrap:wrap; padding-right:2rem;}
    .design .titlecontentbrand .content{width:100%;}
    .design .titlecontentbrand .content p{width:100%; font-size:1.125rem; line-height:2.5rem; color:#585858; margin-bottom:2.5rem; font-weight:300; text-align:right;}
    .design .titlecontentbrand .brand{width:100%;}
    .design .titlecontentbrand .brand div{width:100%; display:flex; flex-wrap:nowrap; justify-content:flex-end; margin-bottom:1rem;}
    .design .titlecontentbrand .brand div img{float:left; margin-left:1rem;}
    .design figure{width:32.5rem; flex:0 0 32.5rem;}
    .design figure img{width:100%; float:left; margin-top:5rem;}
    @media only screen and (max-width:1220px){
        .design-main .container{width:100%; padding:0px 1.25rem;}
    }
    @media only screen and (max-width:767px){
        .design-main{padding:2rem 0px;}
        .design{flex-wrap:wrap;}
        .design .titlecontentbrand{padding-right:0rem;}
        .design .titlecontentbrand .content p{font-size:1rem; line-height:2rem; margin-bottom:1rem;}
        .design .titlecontentbrand .brand div{margin-bottom:0rem; flex-wrap:wrap;}
        .design .titlecontentbrand .brand div img{margin-left:.5rem; height:3rem;}
        .design figure{width:100%; flex:0 0 100%;}
        .design figure img{width:100%; float:left; margin-top:0rem;}
    }
/* PRODUCTION */
    .production-main{width:100%; padding:3.25rem 0px 4.25rem;}
    .production-main .container{max-width:1360px; width:100%; position:relative; margin:0 auto;}
    .production{width:100%; display:flex; flex-wrap:wrap; justify-content:center;}
    .production figure{width:100%;}
    .production figure img{width:100%; float:left; box-shadow:0 10px 20px 0 rgba(0,0,0,.2);}
    .production .content{width:100%; max-width:1200px; margin-top:2rem;}
    .production .content p{width:100%; font-size:1.125rem; line-height:2.5rem; color:#585858; font-weight:300; text-align:center;}
    @media only screen and (max-width:1360px){
        .production-main .container{max-width:100%;}
    }
    @media only screen and (max-width:767px){
        .production-main{padding:2rem 0px;}
        .production .content{padding:0px 5%;}
        .production .content p{font-size:1rem; line-height:2rem;}
    }
/* CONTACT */
	.contact-main{width:100%; padding:4.25rem 0px 6.25rem;}
    .contact-main .container{max-width:1110px; width:100%; position:relative; margin:0 auto;}
    .contact{width:100%; display:flex; flex-wrap:wrap; justify-content:center;}
    .contact .items{width:100%; display:flex; flex-wrap:nowrap;}
    .contact .items .item{display:flex; flex-wrap:wrap; align-content:flex-start;}
    .contact .items .item1{width:55%; padding-right:5%;}
    .contact .items .item2{width:45%; padding-left:5%;}
    .contact .items .item figure{width:100%; display:flex; flex-wrap:wrap; margin-bottom:2rem;}
    .contact .items .item figure img{float:left;}
    .contact .items .item p{width:100%; font-size:1.125rem; line-height:2rem; color:#585858; font-weight:300;}
    .contact .items .item a{color:#585858;}
    .contact .items .item a:hover{color:#D1E751;}
	.contact form{width:35rem; display:flex; flex-wrap:wrap; margin-top:3rem;}
	.contact form input{width:100%; border:solid 2px #FFF; background:none; color:#585858; height:3.125; margin-bottom:1.25rem; padding:0px 1rem; line-height:3rem; font-size:1.125rem; border:solid 1px #CECECE; border-radius:.25rem;}
	.contact form input::-webkit-input-placeholder{color:#585858 !important;}
	.contact form input::-moz-placeholder{color:#585858 !important;}
	.contact form input:-ms-input-placeholder{color:#585858 !important;}
	.contact form input:-moz-placeholder{color:#585858 !important;}
	.contact form input:hover{border:solid 1px #D1E751; color:#D1E751;}
    .contact form textarea{width:100%; border:solid 2px #585858; background:none; color:#585858; height:10rem; margin-bottom:1.25rem; padding:0px 1rem; line-height:3rem; font-size:1.125rem; border:solid 1px #CECECE; border-radius:.25rem;}
    .contact form textarea::-webkit-input-placeholder{color:#585858 !important;}
    .contact form textarea::-moz-placeholder{color:#585858 !important;}
    .contact form textarea:-ms-input-placeholder{color:#585858 !important;}
    .contact form textarea:-moz-placeholder{color:#585858 !important;}
    .contact form textarea:hover{border:solid 1px #D1E751; color:#D1E751;}
    .contact form .onay_yanlis{border:solid 1px #F00;}
    .contact form .onay_dogru{border:solid 1px #5DFA24;}
	.contact form button{width:100%; border:solid 2px #D1E751; background:#D1E751; color:#585858; height:3.125rem; text-align:center; line-height:3rem; font-size:1.25rem; cursor:pointer; border-radius:.25rem;}
	.contact form button:hover{background:none; color:#D1E751;}
    .contact form .button{display:none; width:100%; border:solid 2px #D1E751; background:#D1E751; color:#585858; height:3.125rem; text-align:center; line-height:3rem; font-size:1.25rem; border-radius:.25rem;}
    .contact form .message{margin-top:.5rem; font-size:.9rem; color:#F00;}
	@media only screen and (max-width:1110px){
        .contact-main .container{max-width:100%; padding:0px 1.25rem;}
    }
    @media only screen and (max-width:767px){
        .contact-main{padding:2rem 0px 3rem;}
        .contact .items{flex-wrap:wrap;}
    	.contact .items .item{width:100%; padding:0px 0px 3rem;}
        .contact form{margin-top:0px;}
	}
    @media only screen and (max-width:35rem){
        .contact form{width:100%;}
    }
	@media only screen and (max-width:500px){
		.main-contact form .title{font-size:3rem;}
		.main-contact form input{height:50px; margin-bottom:10px; line-height:46px; border:solid 1px #FFF;}
		.main-contact form input:hover{border:solid 1px #D1E751;}
		.main-contact form button{border:solid 1px #D1E751;}
	}
	@media only screen and (max-width:400px){
    	.main-contact form{width:100%;}
	}
/* FOOTER */
    footer{width:100%; padding:4.5rem 0px 3.5rem; position:relative; display:flex; flex-wrap:wrap; justify-content:center; background:#FAFAFA;}
    footer h5{font-size:24px; color:#585858; font-family:'Playfair Display', serif; font-weight:700; font-style:italic; margin-bottom:2rem; letter-spacing:1rem;}
    footer ul{width:100%; display:flex; flex-wrap:wrap; justify-content:center;}
    footer ul li{margin:1rem 1.5rem; display:flex; flex-wrap:nowrap;}
    footer ul li a{display:flex; flex-wrap:wrap; align-items:center; color:#585858; font-size:.875rem;}
    footer ul li a:hover{color:#D1E751;}
    footer ul li a img{float:left; margin-right:1rem;}
/* MAIN TITLE */
    .maintitle{width:100%; display:flex; flex-wrap:wrap; position:relative; margin-bottom:3rem;}
    .maintitle.center{justify-content:center;}
    .maintitle.right{justify-content:flex-end;}
    .maintitle .title{font-size:3.75rem; line-height:.75; color:#585858; font-weight:700; font-style:italic; font-family:'Playfair Display', serif; border-bottom:solid .25rem #D1E751;}
    @media only screen and (max-width:767px){
        .maintitle{margin-bottom:2rem;}
        .maintitle .title{font-size:3rem;}
    }
    @media only screen and (max-width:381px){
        .maintitle{margin-bottom:1.5rem;}
        .maintitle .title{font-size:2.5rem;}
    }  
/* ANIME */
    .fadeInDown{opacity:1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; -webkit-animation-name:fadeInDown; animation-name:fadeInDown;}
    @-webkit-keyframes fadeInDown{
      0%{opacity:0; -webkit-transform:translateY(-20px); transform:translateY(-20px);}
      100%{opacity:1; -webkit-transform:translateY(0); transform:translateY(0);}
    }

    @keyframes fadeInDown{
      0%{opacity:0; -webkit-transform:translateY(-20px); -ms-transform:translateY(-20px); transform:translateY(-20px);}
      100%{opacity:1; -webkit-transform:translateY(0); -ms-transform:translateY(0); transform:translateY(0);}
    }

@-webkit-keyframes fadeOutDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
}

@keyframes fadeOutDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }
}

.fadeOutDown{-webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; -webkit-animation-name:fadeOutDown; animation-name:fadeOutDown;}