@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:400,300,500,700');
@import url('https://fonts.googleapis.com/earlyaccess/notosansjp.css');
/*@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;500');*/

body {
    font-family: 'Noto Sans JP', 'Open Sans', Arial, Verdana, 'YuGothic', 'Yu Gothic', '游ゴシック', '游ゴシック体', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;    
	font-weight:400;
    font-size: 16px;
    color:#333;
}
/* ====================== 
  RESET
====================== */ 
ol,ul,li {
    list-style: none;
    margin:0; padding:0;
}
a {color:#333}
img {width:100%}
p {line-height:30px}

/* ====================== 
  COMMON
====================== */
#contents{
    background: #f0f0f0;
}
section.page-section{
    background:#fff;
    padding: 80px 0;
}
section.page-section:last-child {
    padding-bottom: 120px;
    margin-bottom:0;
}
.text-primary {
    color:#00757F!important;
}
a.text-primary:hover {
    color:#00757F!important;
}
.a-line {
    text-decoration: underline
}
a:hover {color:#D70050}
a:hover img  {
    opacity: 0.7;
    filter: alpha(opacity=70);
    -ms-filter: "alpha(opacity=70)";
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
}
.a-link {
	position: relative;
	display: inline-block;
	transition: .3s;
}
	.a-link:hover{
		text-decoration:none;
	}
	.a-link::after {
		position: absolute;
		bottom: -2px;
		left: 0;
		/*left: 50%;*/
		content: '';
		width: 100%;
		height: 1px;
		background-color: #333;
		transition: .3s;
		transition: width 0.3s;
		/*transform: translateX(-50%);*/
	}
	.a-link:hover::after{
		width: 0%;
	}

.bg-2 {background:#f7f7f7}
.w100 {width:100%}
span.m {display: inline-block;width:50px;}
#logo {width:70%}
.h60 {height:60px}
.sp {display:none}
.pc {display:block}


/* NAVI */
#mainNav .navbar-nav .nav-item .nav-link:active,
#mainNav .navbar-nav .nav-item .nav-link:hover {
    /*color:#D70050!important;*/
    border-bottom:1px solid rgba(255,255,255,.8);
}
#mainNav .navbar-nav .nav-item .nav-link,
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-family: 'Noto Sans JP', Arial, Verdana, 'YuGothic', 'Yu Gothic', '游ゴシック', '游ゴシック体', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;     
}
#mainNav .navbar-nav .nav-item {
    padding:2px 16px;
}
#mainNav .navbar-nav .nav-item .nav-link {
    display: inline-block;
    /*border-right:1px dotted #ddd;*/
    padding:0;
    /*padding-top:2px;*/
    padding-bottom:6px;
    font-weight: 400;
    border-bottom:1px solid rgba(0,0,0,.0);
}
#mainNav .navbar-nav .nav-item:last-child .nav-link {
    border-right:0;
}
#mainNav .navbar-nav .nav-item .nav-link.active,
#mainNav.navbar-scrolled .navbar-nav .nav-item .nav-link:hover {
    color:#fff!important;
    border-bottom:1px solid rgba(255,255,255,.8);
    /*box-sizing: border-box;*/
}
#mainNav .navbar-nav .nav-item .nav-link:active, #mainNav .navbar-nav .nav-item .nav-link:hover {
    color:#fff;
}
button:focus {
    outline:0;
}
#mainNav{
    transition: all .5s ease-in-out;
}
.navbar-light .navbar-toggler {
    border:0
}
@media (min-width: 992px){
    #mainNav.navbar-scrolled {
        -webkit-box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 15%);
        box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 15%);
        background-color: #000;
        padding:10px 0!important;
    }
    #mainNav.navbar-scrolled .navbar-nav .nav-item .nav-link {
        color: #fff;
    }
    #mainNav .navbar-nav .nav-item:last-child .nav-link {
        /*padding-right:16px;*/
    }
}

.navbar-light .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgba(255, 255, 255, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* HEADING */
h1 {
	font-size:2.6em;
}
h1 > span {
    display:block;
    font-weight: 700;
    margin-bottom: 10px;
    font-size: 20px;
}

h2 {
    font-size:2.0em;
    font-weight: 700;
}
h2 > span {
    display:block;
    font-weight: 400;
    margin-bottom: 10px;
    font-size: 20px;
}

h3 {
    font-size: 26px;
    font-weight: 500;    
    letter-spacing: 0.1em;
    padding: 14px 0 14px 14px;
    display: block;
    line-height: 1.2;
    border-left: solid 5px #D70050;
    /*border-top:1px dotted #666;
    border-bottom:1px dotted #666;*/
    margin-bottom:20px;
}
h3 > span {
    /*border-left: solid 5px #D70050;*/
    /*padding-left:10px;*/
    /*margin-left:-10px;*/
    font-size: 0.7em;
    display: block;
}

hr.divider {
    border-color:#000;
    max-width:10rem;
}

/* HEAD */
.head-area {
	height: 500px;
	background-image:url(../img/head/head.jpg);
	background-position: 50% 0%;
}
.hero-wrap {
    width: 100%;
    height: 100%;
    position: inherit;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
    position: relative;
}
.head-area .overlay {
	height: 500px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    content: '';
    opacity: .5;
    background: #000;
}
.head-area .overlay {
    opacity: .3; /*.6*/
}
.head-area .slider-text {
    height: 500px;
}
.hero-wrap {
    width: 100%;
    height: 100%;
    position: inherit;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
    position: relative;
}


/* BUTTON */
.btn-xl{
    display:block;
    font-size:16px;
    text-align: center;
    /*width: 300px;*/
    border-radius: 0;
    /*border: 1px solid #000;*/
    background:#fff;
    padding: 14px 30px;
    /*padding: 13px 60px 14px 60px;*/
    /*margin:50px auto 0 auto;*/
    color:#000;
    transition:all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    background: url(../img/common/arrow_n.png) #fff no-repeat center right 8px;
    background-size: 6px auto;
    
    text-transform: lowercase;
}
.btn-xl:hover{
    background:#000;
    color: #fff;
    text-decoration: none;
}


/* FOOTER SECTION */
footer h1{
	margin:0;
	font-size:0.9em;
	font-weight:400;
	text-align:center;
}
#footer-contact {
	background:#D70050;
	padding:20px 0;
	color:#fff;
}
.footer-contact-txt {
	padding:10px 0;
	margin:0;
	text-align:center;
}
.footer-contact-btn {
	padding:0; margin:0;
	
}
.footer-contact-btn i {
	margin-right:10px;
}
.footer-contact-btn a {
	display:block;
	font-size:1.3em;
	text-align:center;
	font-weight:700;
	color:#000;
	padding:10px;
	background-color: #f3eeee; /*e92971*/
	/*border-bottom: 2px solid #b84c00;*/
}

.footer-copy {
	background:#000;
	padding:10px 10px;
	color:#fff;
    font-size: 12px;
}
#footer_section {
    color:#fff;
    background:#000;
}


/* pagetop */
#pagetop {
    display: none;
    position: fixed;
    right: 5px;
    bottom: 40px;
    height: 50px;
    text-decoration: none;
    font-weight: 400;
    transform: rotate(90deg);
    font-size: 90%;
    line-height: 1.5rem;
    color: #797979;
    padding: 0 0 0 35px;
    border-top: solid 1px;
}
#pagetop::before {
    content: "";
    display: block;
    position: absolute;
    top: -1px;
    left: 0px;
    width: 25px;
    border-top: solid 1px;
    transform: rotate(35deg);
    transform-origin: left top;
}

/* ul */
.ul-list {
    margin-left:20px;
}
.ul-list li {
    list-style: disc!important;
}

/* COMMON MQ */
@media (max-width: 768px) {
    .sp{display:block}
    .pc{display:none}
    h1 {font-size:2.2em}
    h2 {font-size:1.5em}
    h2 > span {font-size:16px}
    h3 {font-size:20px}
    h4 {font-size:1.2em!important}
    #logo {width:60%}
    #mainNav {
        background:#000;
        padding-top:0.4rem;
        padding-bottom:0.1rem;
    }
    #mainNav .navbar-nav .nav-item .nav-link {
        /*color:#000;*/
        color:#fff;
        border:0;
        display: block;
        padding: 6px 10px;
    }
    #mainNav .navbar-nav .nav-item .nav-link:active {
        /*color:#00757F;*/
        border-bottom: 1px solid #000;
    }
    #mainNav .navbar-nav .nav-item {
        padding:5px 0;
        /*border-bottom: 1px solid rgba(255,255,255,.3);*/
    }
    #mainNav.navbar-scrolled .navbar-nav .nav-item .nav-link:hover {
        border-bottom:none;
    }
    .navbar-nav {
        /*padding-left:30%*/
    }
    #mainNav .navbar-brand {
        width:70%;
    }
    section.page-section {
        padding: 50px 0;
    }
    section.page-section:last-child {
        padding-bottom: 50px;
    }
    .page-header {
        padding-top: 3.0em;
        padding-bottom: 3.0em;
    }
    header h1 {
        font-size:1.55em;
    }
    .footer-contact-btn {
        margin-bottom:10px;
    }
    .fotter__text:first-child ul {
        padding-bottom:20px;
        margin-bottom:20px;
        border-bottom:1px solid #1f919b;
    }
    #footer_section {
        padding-top: 20px;
        padding-bottom:0
    }
}

/* ====================== 
  INDEX-PAGE
====================== */ 
/* MAIN VISUAL */
.title-block {
	position: relative;
}
.title-movie, .title-block {
    width: 100%;
    height: 100%;
    display: flex;
}
video {
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    transform: translateX(-50%) translateY(-50%);
    background-size: cover;
    transition: 1s opacity;
    width: 100%;
    background-color: #000;
}
header.masthead {
  padding-top: 10rem;
  padding-bottom: calc(10rem - 72px);
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(226, 222, 219, 0.1)), to(rgba(0, 0, 0, 0.8))), url("../img/head/main.jpg");
  background: linear-gradient(to bottom, rgba(226, 222, 219, 0.1)) 0%, rgba(0, 0, 0, 0.8) 100%), url("../img/main.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-size: cover;
}
.masthead h1 {
    padding-bottom:30px;
}
@media (min-width: 1200px){
	header.masthead h1 {
	    font-size: 3.4rem;
	}
}

.masthead h1:after{
    content: '';
    position: absolute;
    width: 310px;
    border-bottom: 2px solid rgba(201,201,201,.4);
    bottom: 0;
    left: 50%;
    margin-left: -155px;
}

#scroll-to-content {
    display: block;
    position: absolute;
    left: 50%;
    bottom: 20px;
    z-index: 5;
    cursor: pointer;
    height: 1.5em;
    width: 3.5em;
    font-size: 16px;
    font-size: 1rem;
    overflow: hidden;
    opacity: .5;
    transform: translateX(-50%);
    animation: pulsate 1.5s ease-out infinite;
}
#scroll-to-content:before {
    content: '';
    display: block;
    position: absolute;
    left: 15px;
    bottom: 10px;
    height: 30px;
    width: 30px;
    border: 2px solid #fff;
    transform: rotate(45deg);
}

/* -about us */
section#service {
    background:#E5E9EC
}
.about-list {
  padding: 0 1em 0.5em 2.3em;
  position: relative;
}
.about-list li {
  line-height: 1.5;
  padding: 0.5em 0;
  list-style-type: none!important;
}
.about-list li > i.fas {
    padding-right:10px
}

@media (max-width:768px) {
    .about-list {
        padding: 0 0 0 0.3em;
    }
}

/* -company */
.company-list {
    margin-left:24px;
}
.company-list li {
    list-style-type:disc;
}
@media (max-width:768px) {
    #company-logo {
        width: 75%;
        margin:auto 0;
    }
}

/* -contact */
section#contact {
/*  padding-bottom: calc(10rem - 72px);
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(226, 222, 219, 0.1)), to(rgba(0, 0, 0, 0.8))), url("../img/top_contact.jpg");
  background: linear-gradient(to bottom, rgba(226, 222, 219, 0.1)) 0%, rgba(0, 0, 0, 0.8) 100%), url("../img/top_contact.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-size: cover;    */

	display: table;
	position: relative;
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(226, 222, 219, 0.1)), to(rgba(0, 0, 0, 0.8))), url("../img/top_contact.jpg");
    background: linear-gradient(to bottom, rgba(226, 222, 219, 0.1)) 0%, rgba(0, 0, 0, 0.8) 100%), url("../img/top_contact.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: fixed;
    background-size: center;
	min-height: 400px;
	width: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
#notice {
	color:#fff;
	font-size:0.8em;
	display:block;
	text-align:center;
}

@media (max-width: 768px){
	section#contact {
	    background-attachment: scroll;
	    min-height: 200px;
	}
}

/* -images */
section#images {
    background: #000;
    padding:0;
}
section#images .col-md-3 {
    padding:0!important;
}
.service-image {
	display: table;
	position: relative;
	background: url(../img/top_contact.jpg) no-repeat center center fixed;
	min-height: 400px;
	width: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
@media (max-width:768px) {
	.service-image {
		background-attachment: scroll;
		min-height: 200px;
	}
}

/* INDEX MQ */
@media screen and (max-width: 726px){
    .title-movie {
        width: 100%;
        height: auto;
        display: block;
        background-color: #000;
        padding: 70px 0 0;
    }
    video {
        position: relative;
        top: auto;
        left: auto;
        min-width: 100%;
        min-height: auto;
        width: 100%;
        height: auto;
        z-index: 1;
        transform: none;
        background-size: cover;
        transition: 1s opacity;
    }
}

@media (max-width: 768px) {
    .main-copy p {
        font-size:2em;
        line-height:36px;
        margin-bottom:0;
    }
    .main-copy p > span {
        line-height: 26px;
        padding-top:10px
    }
    .sub-copy {
    	top:35%;
    }
    .sub-copy p {
        font-size:2em;
        line-height: 30px
    }
    .fotter-contact-text {
        border-left:0;
        padding: 0 50px;
        margin-bottom:30px;
    }
    .fotter-contact-text p {
        padding-bottom:10px;
        border-bottom:1px solid #1f919b;
    }
}
/* INDEX-PAGE END */