/* ----------　all　---------- */
@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@600&display=swap');

.linkStyle{
	color:#337590;
}
.linkStyle:hover{
	color:#d6e3e9;
	opacity: 0.8;
	transition: all 0.5s;
}

.txt_color1{color: #337590} /* メインカラー */

.bg_color1{background-color: #337590} /* メインカラー */
.bg_color2{background-color: #5c676c} /* サブカラー */
.bg_color3{background-color: #5c676c} /* アクセントカラー1 */
.bg_color4{background-color: #d6e3e9} /* アクセントカラー2 */

/* border-color ※!important */
.border_color1{border-color: #337590}
.border_color2{border-color: #5c676c}
.border_color3{border-color: #5c676c}
.border_color4{border-color: #d6e3e9}

.hvr_txt_color1:hover{
    color: #337590
}

.hvr_bg_color4:hover {
    background-color: #d6e3e9;
}


#fix_menu, #overlay {
	background-image:url("Dup/img/header-bg.jpg");
	
}

.overlay.open .menu-box .menu_list li {
    font-weight: bold;
}

/*
#loading #loading_line .line {
	background-color:#eff4f6;
	
}*/

#logo {
	height: 140px;
	background-color: transparent;
}

#logo .logo{
    top:45%;
}

#logo .logo a img {
    width: 100%!important;
}


.con_fix_inner {
	color: #ffffff;
	position: fixed;
	bottom:5%;
	left: 5%;
	width: 10%;
	max-width: 300px;
    min-width: 140px;
    text-align: center;
	padding: 20px 0px;
	background-color: #337590;
	align-items: center;
	z-index: 20;
}

.con_fix_inner:hover {
	opacity:0.75;
}





/* ----------　TOP　---------- */


.main-copy {
	position:absolute;
	display: block;
	align-items: center;
	padding: 60px 5px 60px 20px;
	top:25%;
	left: 15%;
	z-index: 5;
	font-size: 40px;
	font-family: 'Shippori Mincho', serif; 
	color: #337590;
	background-color:rgba(239,244,246,0.8)
}



#top_contents1 {
    background-image: url(Dup/img//contents1_bg_r.png), url("Dup/img/contents1_bg_l.png");
    background-size: 30%, 30%;
    background-position: right -10% top -10%, left -10% bottom -120px;
    background-repeat: no-repeat, no-repeat;
}


#top_contents1 h2::after {
	content:"-introduction-";
	position: absolute;
	top: 65%;
	left: 40%;
	font-size: 30px; 
	font-family:'Dancing Script', cursive;
	z-index: -10;
	color: #d6e3e9;
	
}


#top_contents2 .point1 h2::before {
	content:"point 01";
	position: absolute;
	top: 20px;
	right: 5%;
	font-size: 65px; 
	font-family:'Dancing Script', cursive;
	z-index: -10;
	color: #d6e3e9;
}

#top_contents2 .point2 h2::before {
	content:"point 02";
	position: absolute;
	top: 20px;
	right: 5%;
	font-size: 65px; 
	font-family:'Dancing Script', cursive;
	z-index: -10;
	color: #d6e3e9;
}

#top_contents2 .con_box .text_box {
    max-height: 130%;
}

#top_cms .top_cms_box {
    background-image: url(Dup/img/contents1_bg_r.png);
    background-size: 30%;
    background-repeat: no-repeat;
    background-position: right top;
}

#top_cms .top_cms_box:nth-of-type(even) {
    background-image: url(Dup/img/contents1_bg_l.png);
    background-position: left bottom;
}


#top_contact_box .con_bt a {
    padding-left: 0;
}

#top_contact_box .con_bt, #top_contact_box .tel_bt {
    min-width: 300px;
}

.btn_wrap .inner .btn_box:last-of-type {
    margin-left: 80px;
}





/* ----------　下層ページ　---------- */









/*before・after*/

.BA_type1 .box_item, .BA_type1 .box_img1, .BA_type1 .box_img2 {position: relative;}
.BA_type1 .box_item::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50.3%;
    transform: translate(-50%,-50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 17px 0 17px 40px;
    border-color: transparent transparent transparent #337590;
}
.BA_type1 .box_img1 {margin-right: 40px;}
.BA_type1 .box_img2 {margin-left: 40px;}
.BA_type1 .box_img1::after, .BA_type1 .box_img2::after {
    position: absolute;
    height: 33px;
    width: 87px;
    background-color: #fff;
    color: #434343;
    font-size: 18px;
    font-weight: 700;
    text-align: center;
}
.BA_type1 .box_img1::after {content: "before";}
.BA_type1 .box_img2::after {content: "after";}



/* 会社情報 */
/* お問い合わせ */

.con_mail {
    margin: 100px auto 5px auto;
}

/* プライバシーポリシー */
/* サイトマップ */


/*-------------------------------------------------------
			          タブレット
-------------------------------------------------------*/
@media screen and (max-width: 768px){
    
#logo {
    height: 95px;
}

.main-copy {
	padding: 40px 5px 40px 20px;
	top:20%;
	left: 10%;
	font-size: 30px;
}

 #top_contents1 {
    background-size: 40%, 40%;
    background-position: right -10% top -50px, left -10% bottom -50px;
}   
    
    

#top_contents1 h2::after {
    left:35%;
}


#top_contents2 .point1 h2::before {
	top: -10px;
	right: 5%;
	font-size: 65px;
}

#top_contents2 .point2 h2::before {
	top: -10px;
	right: 5%;
	font-size: 65px;
}

#top_cms .top_cms_box {
    background-image: url(Dup/img/contents1_bg_r.png);
    background-size: 50%;
    background-repeat: no-repeat;

}

    
.btn_wrap .inner .btn_box:last-of-type {
    margin-left: 0;
}

    
}

/*-------------------------------------------------------
		            	スマホ
-------------------------------------------------------*/
@media screen and (max-width: 667px){
    
    
.main-copy {
    padding: 10px 0px 10px 10px;
    top: 15%;
    left: 5%;
    font-size: 18px;
}
    
#logo h1.logo {
    top:45%!important;
}
    
#logo .logo a img {
    width: 70%!important;
}
    
  #top_contents1 {
    background-size: 50%, 40%;
    background-position: right -10% top -45px, left -10% bottom -10px;
}  

#top_contents1 h2 {
    font-size: calc(1rem + 2px);
}

#top_contents1 h2::after {
    left: 25%;
    top: 90%;
    font-size: 25px;
}

#top_contents2 .point1 h2::before {
	top: -5px;
	right: 5%;
	font-size: 35px;
}

#top_contents2 .point2 h2::before {
	top: -5px;
	right: 5%;
	font-size: 35px;
}

.con_fix_inner {
	color: #ffffff;
	position: fixed;
	bottom:0;
	left: 35%;
}

	footer {
		margin-bottom: 60px;
	}



/*お問い合わせ*/
#contact_tel a, #contact_mail {
    padding: 10px;
    font-size: calc(1rem + 2px);
}



    
/*before・after*/    
.BA_type1 .box_img1 {margin-right: 5%;margin-bottom: 50px;}
.BA_type1 .box_img2 {margin-left: 5%;}
.BA_type1 .box_img1::after, .BA_type1 .box_img2::after {height: 30px;font-size: 15px;}
.BA_type1 .box_item::after {transform: translate(-50%,-60%) rotate( 90deg);border-width: 20px 0 20px 23px;}
    
    
    


}