@charset "utf-8";

/* bannerRow Setting
******************/
.bannerRow .bg
{ background:url(../images/cmn/img-manifesto-bg.jpg) no-repeat center; background-size:cover; background-attachment: fixed; opacity:0.15; }

/* contactContent Setting
******************/
.contactContent
{ position:relative; width:90%; padding:80px 0px; margin:0px auto; background:#ffffff;}
.contactContent .formArea
{ width:100%; max-width:550px; margin:0px auto; margin-bottom: 50px; }
.contactContent .leadin
{ font-size:18px; line-height: 1.3; color:#000000; margin-bottom:30px; text-align: center; }

.contactContent .required
{ font-size:13px; line-height: 1.3; color:#59b3c7; margin-bottom:30px; text-align: left; }

.contactContent .fieldLabel
{ font-size:13px; line-height: 1.3; color:#666666; margin-bottom:5px; text-align: left; }
.contactContent .fieldLabel span
{ font-size:13px; color:#59b3c7;}
.contactContent .inputRow
{ margin-bottom: 20px;}
.contactContent .fieldInput
{ position:relative; padding:8px; border:1px solid #999999;}
.contactContent .fieldInput input[type="text"],
.contactContent .fieldInput input[type="email"],
.contactContent .fieldInput input[type="tel"]
{ font-size:15px; color:#000000; line-height: 1.35; width:100%;}
.contactContent .fieldInput textarea
{ font-size:15px; color:#000000; line-height: 1.35; width:100%; height: 200px; resize: none; border:none;}

.contactContent .errorMsg
{ padding-top:5px; font-size:13px; color:#59b3c7; line-height: 1.35; width:100%;}

.contactContent .fieldInput select
{ position:relative; display:block; width:100%; color:rgba(0,0,0,.6); -webkit-appearance:none; -moz-appearance:none; appearance:none; font-size:15px; line-height: 1.35; z-index: 5; font-weight: 300; outline:0; border:none; background-color:transparent; }
.contactContent .fieldInput select
{ font-family:'AudiTypeScreen',Verdana,Geneva,sans-serif !important;}
.contactContent .fieldInput.selection:before
{ position:absolute; display:block; content:''; top:50%; right:8px; width:13px; height:8px; margin-top: -4px; background:url('../images/cmn/img-down-arrow.svg') center center no-repeat; background-size:cover; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; transform: rotate(0deg);}
.contactContent .fieldInput.selection.active:before
{ transform: rotate(180deg);}


.contactContent .ctaRow
{ text-align: center; margin-bottom: 50px;}
.contactContent .ctaRow a
{ cursor: pointer;}
.contactContent .ctaRow button[type="reset"]
{ cursor: pointer; position:relative; display:inline-block; padding:14px 36px 13px; background:#ffffff; font-size:16px; line-height: 1.35; color:#333333; font-weight: 400; border:none; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; margin-right: 20px; vertical-align: top;}
.contactContent .ctaRow a#btnSubmit
{ position:relative; display:inline-block; padding:14px 36px 13px; background:#ffffff; font-size:16px; line-height: 1.35; color:#333333; font-weight: 400; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; overflow: hidden; font-weight: 500; vertical-align: top;}
.contactContent .ctaRow a#btnSubmit::before
{ position:absolute; top:0px; left:0px; content:''; border-top:2px solid #000000; border-left:2px solid #000000; width:10px; height: 10px; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}
.contactContent .ctaRow a#btnSubmit::after
{ position:absolute; bottom:0px; right:0px; content:''; border-bottom:2px solid #000000; border-right:2px solid #000000; width:10px; height: 10px; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}

.contactContent .ctaRow button[type="reset"]:hover
{ background:#eeeeee;}

.contactContent .ctaRow a#btnSubmit:hover
{ background:#7fdbef; color:#164e5a;}
.contactContent .ctaRow a#btnSubmit:hover::before
{ border-top:2px solid #59b3c7; border-left:2px solid #59b3c7; width:100%; height: 100%;}
.contactContent .ctaRow a#btnSubmit:hover::after
{ border-bottom:2px solid #59b3c7; border-right:2px solid #59b3c7; width:100%; height: 100%;}

.contactContent .orRow
{ position:relative; width:90%; max-width:200px; margin: 0px auto; margin-bottom: 50px; text-align: center;}
.contactContent .orRow span
{ position:relative; display:inline-block; padding:0px 15px; font-size:18px; color:#000000; line-height: 1.35; background:#ffffff; margin: 0px auto;}
.contactContent .orRow::before
{ position:absolute; top:50%; left:0px; width:100%; display:block; content:''; border-bottom:1px solid #000000;}

.contactContent .otherRow
{ position:relative; width:90%; max-width:500px; margin: 0px auto; font-size:0px;}
.contactContent .otherRow .lCol,
.contactContent .otherRow .rCol
{ width:50%; padding:10px 0px; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}
.contactContent .otherRow .lCol
{ border-right:1px solid #000000;}
.contactContent .otherRow dt
{ display:block; font-size:15px; color:#000000; line-height: 1.35; width:100%; margin-bottom: 5px; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}
.contactContent .otherRow dd
{ display:block; width:100%; margin-bottom: 10px;}
.contactContent .otherRow .lCol dd a
{ display:inline-block; font-size:15px; color:#000000; line-height: 1; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}
.contactContent .otherRow .lCol dt
{ color:#000000;}
.contactContent .otherRow .rCol dd a
{ display:inline-block; width:24px; height: 24px; margin-left: 10px;}
.contactContent .otherRow .rCol dd a:first-child
{ margin-left: 0px;}
.contactContent .otherRow .lCol:hover dd a
{ color:#59b3c7;}


@media screen and (max-width:768px){
    
/* contactContent Setting
******************/
.contactContent
{ padding:60px 0px;}
.contactContent .formArea
{ margin-bottom: 50px; }
.contactContent .leadin
{ font-size:18px; margin-bottom:30px; }

.contactContent .required
{ font-size:13px;margin-bottom:30px; }

.contactContent .inputRow
{ margin-bottom: 20px;}
.contactContent .fieldLabel
{ font-size:13px; line-height: 1.3; color:#666666; margin-bottom:5px; text-align: left; }
.contactContent .fieldLabel span
{ font-size:13px; color:#59b3c7;}
.contactContent .fieldInput
{ padding:8px;}
.contactContent .fieldInput input[type="text"],
.contactContent .fieldInput input[type="email"],
.contactContent .fieldInput input[type="tel"]
{ font-size:15px;}
.contactContent .fieldInput textarea
{ font-size:15px; height: 200px; }

.contactContent .ctaRow
{ margin-bottom: 50px;}
.contactContent .ctaRow button[type="reset"]
{ padding:14px 36px 13px; font-size:16px; margin-right: 20px;}
.contactContent .ctaRow button[type="submit"]
{ padding:14px 36px 13px; font-size:16px; margin-right: 20px;}

.contactContent .orRow
{ margin-bottom: 50px; }
.contactContent .orRow span
{ padding:0px 15px; font-size:18px;}
    
.contactContent .otherRow .lCol,
.contactContent .otherRow .rCol
{ width:50%; padding:10px 0px;}
.contactContent .otherRow dt
{ font-size:15px; margin-bottom: 5px; }
.contactContent .otherRow dd
{ margin-bottom: 10px;}
.contactContent .otherRow .lCol dd a
{ font-size:15px;}
.contactContent .otherRow .rCol dd a
{ width:24px; height: 24px; margin-left: 10px;}
}

@media screen and (max-width:500px){
    
/* contactContent Setting
******************/
.contactContent
{ padding:12vw 0px;}
.contactContent .formArea
{ margin-bottom: 8vw; }
.contactContent .leadin
{ font-size:3.75vw; margin-bottom:6vw; }

.contactContent .required
{ font-size:3vw; margin-bottom:6vw; }
.contactContent .inputRow
{ margin-bottom: 4vw;}
.contactContent .fieldLabel
{ font-size:3vw; margin-bottom:5px; }
.contactContent .fieldLabel span
{ font-size:3vw; color:#59b3c7;}
.contactContent .fieldInput
{ padding:8px;}
.contactContent .fieldInput input[type="text"],
.contactContent .fieldInput input[type="email"],
.contactContent .fieldInput input[type="tel"]
{ font-size:3.25vw;}
.contactContent .fieldInput textarea
{ font-size:3.25vw; height: 20vw; }
.contactContent .errorMsg
{ font-size:3vw;}

.contactContent .ctaRow
{ margin-bottom: 8vw;}
.contactContent .ctaRow button[type="reset"]
{ padding:14px 36px 13px; font-size:3.5vw; margin-right: 4vw;}
.contactContent .ctaRow button[type="submit"]
{ padding:14px 36px 13px; font-size:3.5vw; margin-right: 4vw;}

.contactContent .orRow
{ margin-bottom: 8vw; max-width:100%; width:100%;}
.contactContent .orRow span
{ padding:0px 3.25vw; font-size:3.75vw;}
    
.contactContent .otherRow .lCol,
.contactContent .otherRow .rCol
{ display:block; width:100%; padding:4vw 0px;}    
.contactContent .otherRow .lCol
{ margin-bottom: 4vw; border:none; border-bottom: 1px solid #000000;}
.contactContent .otherRow dt
{ font-size:3.25vw; margin-bottom: 5px; }
.contactContent .otherRow dd
{ margin-bottom: 10px;}
.contactContent .otherRow .lCol dd a
{ font-size:3.25vw;}
.contactContent .otherRow .rCol dd a
{ width:24px; height: 24px; margin-left: 2.5vw;}
}