.v_type1 .triangle {
    display: block;
    border: #a0a0a0 solid 2px;
    box-shadow: 5px 5px 0 0 #e2e2e2;
}
.v_type1 .triangle:before {
    content: '';
    position: absolute;
    display: block;
    z-index: 1;
    border-style: solid;
    border-color: #FFF transparent;
    border-width: 13px 13px 0 0;
    bottom: -13px;
    left: 50%;
    margin-left: -9px;
}
.v_type1 .triangle:after {
    content: '';
    position: absolute;
    display: block;
    z-index: 0;
    border-style: solid;
    border-color: #a0a0a0 transparent;
    border-width: 15px 15px 0 0;
    bottom: -17px;
    left: 50%;
    margin-left: -11px;
}


/*anim*/
.anim_box .item{
	transform: translateY(20px);
	transition: transform 1.5s ease, opacity 2s;
	transition-property: opacity,transform;
	opacity: 0;
}
.anim_box .item.start{transform: translateY(0);opacity: 1;}

/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■コード集サイト■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/


/*毎回いる*/
section#con2 .font_22 {
    margin-bottom: 5px;
}
.f_contact_box h4 {
    font-size: 33px;
    padding-bottom: 10px;
}
.menu_btn.stick_trans span:last-child { margin-top: -3px;}


/*font------------------------------------------------------------------------*/

h1,h2,h3,h4,h5,h6,a span,.l-menu ul li a,.f_sitemap_inner li a,.copy,.topTxt1,.f_contact_btn a,.jp,.more a,#con2 .font_22,.con1_inner,.f_contact_box p,.tel,#page10 .sitemap li a,.contact_tel a,.contact_mail a{
    font-family:'Zen Kaku Gothic New','Zen Kaku Gothic Antique', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;
    font-weight:500 !important;
}


body{font-family:'Zen Kaku Gothic New','Zen Kaku Gothic Antique', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;}

.contact_tel a i {font-weight: normal;}
.opacity07,.opacity08 {
    opacity: 0.9 !important;}
.font_14 {
    font-size: 15px;}
ul.f_sitemap_inner li a {
    font-size: 15px;
    letter-spacing: 1px;}

/*font------------------------------------------------------------------------*/

/*color------------------------------------------------------------------------*/
body,.txt_color_nomal,.hvr_txt_color_nomal:hover{color: #626262;}
.txt_black,.hvr_txt_black:hover{color: #626262;}
.txt_white,.hvr_txt_white:hover{color: white;}
.txt_red,.hvr_txt_red:hover{color: red;}
.txt_color1,.hvr_txt_color1:hover{color: #b2c72b;} /* メインカラー */
.txt_color2,.hvr_txt_color2:hover{color: #a0a0a0;} /* サブカラー */
.txt_color3,.hvr_txt_color3:hover{color: #899f20;} /* アクセントカラー1 */
.txt_color4,.hvr_txt_color4:hover{color: #d1d1d1;} /* アクセントカラー2 */

/* background-color */
.bg_white,.hvr_bg_white:hover{background-color: white;} /* 白背景 */
.bg_black,.hvr_bg_black:hover{background-color: #626262;} /* 黒背景 */
.bg_color1,.hvr_bg_color1:hover{background-color: #b2c72b;} /* メインカラー */
.bg_color2,.hvr_bg_color2:hover{background-color: #cecece;} /* サブカラー */
.bg_color3,.hvr_bg_color3:hover{background-color: #899f20;} /* アクセントカラー1 */
.bg_color4,.hvr_bg_color4:hover{background-color: #d1d1d1;} /* アクセントカラー2 */
.bg_color5{background-color: #f7f7f7;}
.bg_color_clear,.hvr_bg_color_clear:hover{background-color: transparent!important;}

/* border-color */
.border_white,.hvr_border_white:hover{border-color: white;}
.border_black,.hvr_border_black:hover{border-color: #626262;}
.border_color1,.hvr_border_color1:hover{border-color: #b2c72b;}
.border_color2,.hvr_border_color2:hover{border-color: #a0a0a0;}
.border_color3,.hvr_border_color3:hover{border-color: #899f20;}
.border_color4,.hvr_border_color4:hover{border-color: #d1d1d1;}

.linkStyle {color: #899f20 !important;}
/*color------------------------------------------------------------------------*/


/*アイコンけす------------------------------------------------------------------------*/
#con3 .box .icon {
    position: relative;
    z-index: 1;
    margin-top: -50px;
    display: none;}
    
p.con3_title {
    margin: 30px 0 10px;
    font-size: 25px;
    letter-spacing: 1px;
    color: #899f20;
    font-weight: 500;
    border-bottom: dotted 2px;
}
/*------------------------------------------------------------------------*/

/*【控え目】5～10px*/
/*border-radius-------------------------------------------------------------------------*/
.con_img, .cate_img1, .box_img1, .box_img2, .box_img3, .box_img4, #cms_3-c .cate_box .box_title3 span,#contents3 .con_box,#intro_wrap,#page_title .page_title_box,.pd_l-r10per.pd_t-5per.pd_b-5per.pd_5per_tb.pd_t-50px_sp .con_box,.box_img1 img{border-radius: 5px;}
.nav_menu_more a,.cate_list li a,.pager li a,.v_type1 .triangle,#v_type1 .triangle{border-radius: 5px;}
#cms_2-b h3.cate_title {border-radius: 5px;}
/*border-radius-------------------------------------------------------------------------*/

/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■top■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#main_img {
    padding-top: 0;
    height: 100vh;
    position: relative;
    overflow: hidden;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top 36% center;
}

/*#main_img::before {*/
/*    content: '';*/
/*    position: absolute;*/
/*    background-image: url(dup/img/main_img.png);*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    background-size: cover;*/
/*    background-position: center center;*/
/*    mix-blend-mode: screen;}*/

.catch {
    width: 52%;
    top: 40%;
    left: 3%;
    transform: translate(0%, -50%);
}

#con1 {
    background-image: url(./Dup/img/item01.png);
    background-size: 1000px, 400px;
    background-position: bottom -7px left 0;
    background-repeat: repeat-x;}

.topTxt1 .arrow,.con1_squ{display:none;}

#con1 h2::before {
    position: absolute;
    content: "";
    width: 100px;
    height: 2px;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    background-color: #b2c72b;}

#con1 h2 {
    text-align: center;
    padding-bottom: 20px;
    margin-bottom: 33px;
    position: relative;
    margin-top: 25px;}
    

#con1 p {margin-bottom: 50px;}

#con2 p.font_22 {
    position: relative;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

#con2 p.font_22::before {
    position: absolute;
    content: "";
    width: 50px;
    height: 2px;
    left: 0;
    bottom: 0;
    background-color: #b2c72b;
}

#con3 {
    background-image: url(./Dup/img/item02.png);
    background-size: 180px;
    background-position: top -50px right 15px;
    background-repeat: no-repeat;
}


#con1, #con2, #con2 .img_wrap, #con3, #con3 .box .circle, .all_contents {
    position: relative;}
    
.circle::before {
    content: "";
    display: block;
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    background-image: url(./Dup/img/item03.png);
    background-size: 100%;
    width: 100%;
    height: 100%;
    top: 6px;
    left: 5px;
    opacity: 0.7;
}

span.point_b {
     position: relative; 
    padding: 0.8rem 0.8rem;
}
   
.point_b:after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 6px;
    content: '';
    background-image: -webkit-repeating-linear-gradient(135deg, #b2c72b, #b2c72b 1px, transparent 2px, transparent 5px);
    background-image: repeating-linear-gradient(-45deg, #b2c72b, #b2c72b 1px, transparent 2px, transparent 5px);
    background-size: 7px 7px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}


#con3::before {
    position: absolute;
    content: "";
    width: 145px;
    height: 180px;
    background-image: url(Dup/img/item04.png);
    background-size: contain;
    left: 5%;
    top: -8%;
    z-index: 1;
    background-repeat: no-repeat;
}




/* アニメーション前のスタイル */
.js-marker {
  display: inline;
  position: relative;
  background-image: linear-gradient(90deg, #daeb6e, #daeb6e); /* 単色の場合は同じ色、グラデーションさせる場合は別々の色 */
  background-repeat: no-repeat;
  background-position: bottom left;
  background-size: 0 30%; /* '30%'の部分にマーカーの太さを記入 */
  transition: all 1s ease-in-out; /* マーカーを引く速度を調整 */
  font-weight: bold; /* ついでに太字にしたい場合 */
}

/* アニメーション発火時 */
.js-marker.inview {
  background-size: 100% 30%; /* '30%'の部分は上で設定した太さに合わせる */
}






/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■top■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/


/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■all■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.header-in {background: rgb(242 242 242 / 90%);}
#sp_nav .sp_nav_inner .menu__header {
    border-radius: 40px 40px 0px 0px;
    padding: 50px 100px;
    background: rgb(242 242 242);}
.logo1 {
    max-width: 99px;
    padding-left: 20px;
    padding-right: 20px;}
    
.cate_list li a:hover {
    background: #b2c72b;
    color: #fff;}
 
    

/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ all ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ sub ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.pagetitle {
    color: #b2c72b;
    background: #ffffff;}
    
.pagetitle_img {
    opacity: 0.1;
    mix-blend-mode: normal;}

.pager li a {padding-bottom: 2px;}


main.all_contents::before {
    position: absolute;
    content: "";
    width: 170px;
    height: 300px;
    background-image: url(Dup/img/item02.png);
    background-size: contain;
    right: 1%;
    top: -71px;
    z-index: 1;
    background-repeat: no-repeat;
}

main.all_contents::after {
    position: absolute;
    content: "";
    width: 170px;
    height: 210px;
    background-image: url(Dup/img/item04.png);
    background-size: contain;
    left: 2%;
    bottom: -100px;
    z-index: 1;
    background-repeat: no-repeat;
}
/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ sub ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/


/*タブレット*/
@media screen and (max-width: 768px){
    #main_img {
        padding-top: 0;
        height: 72vh;
        position: relative;
        overflow: hidden;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: top center;}
    
    .logo1 {
        max-width: 65px;
        padding-left: 30px;}
        
    .menu_btn { right: 8px;}
    
    main.all_contents::before {
        width: 100px;
        height: 168px;
        right: 1%;
        top: -69px;
        z-index: 1;}
        
    main.all_contents::after {
        width: 113px;
        height: 140px;
        left: 3%;
        bottom: -85px;}
    
    #cms_2-c .box_item {
        word-break: break-all;
        padding: 20px;}
        
    #con3::before {
        width: 100px;
        height: 140px;
        left: 5%;
        top: -6%;}
        
    #con3 {
        background-size: 130px;
        background-position: top -40px right 15px;}
        
    p.con3_title {
        font-size: 15px;
        letter-spacing: 0px;}
    
    .font_15 {font-size: 14px;}
    
    #con1 { background-size: 900px, 400px;}
    
    .catch {
        width: 59%;
        top: 43%;
        left: 13%;
        transform: translate(-18%, -50%);}


}

/*スマホ*/
@media screen and (max-width: 667px){
#con3 .box .circle:before {
    width: 300px !important;
    height: 300px !important;
    top: auto;
    left: auto;
    bottom: -11px !important;
    right: 9px !important;
    /* transform: translate(30px, 15px); */
}
#con3 .box .img {
    max-width: 300px !important;
    width: 300px !important;
    height: 300px !important;}
.header {
    position: fixed;
    z-index: 99;
    top: 0;}
.header-in {
    margin-top: 0;
    border-radius: 0;}  
header {padding: 0 !important;}
div#main_img {
    position: relative;
    margin-top: 68px;}
    #main_img {height: 60vh;}
.catch {
    width: 75%;
    top: 39%;
    left: 0%;
    transform: translate(0%, -50%);}
    #con1 h2::before {width: 85px;}
    #con1 {background-size: 700px, 400px;}
    #con3::before {
        width: 80px;
        height: 102px;
        left: 5%;
        top: -3%;}
    #con3 {
        background-size: 95px;
        background-position: top -46px right 7px;}
    #con3 .box .img {border-radius: 50%;}
    body {overflow: hidden;}
    p.con3_title {font-size: 22px;}
    .logo2 a {max-width: 160px;}
    .logo1 {max-width: 60px;}
    #sp_nav .sp_nav_inner .menu__header {padding: 8% 8% 6%;}
    #sp_nav .sp_nav_inner {padding: 20px 0px 50px 0px;}
    #sp_nav .sp_nav_inner .menu__header .logo3 img {max-width: 80px;}
    main.all_contents::before {
        width: 64px;
        height: 115px;
        right: 0%;
        top: -45px;
        z-index: 0;}
    main.all_contents::after {
        width: 83px;
        height: 100px;
        left: 3%;
        bottom: -59px;}
    #cms_2-c .box_txt1 {letter-spacing: 0px;}
}



/*2022420*/

.BA_type2 .box_img1_wrap, .BA_type2 .box_img2_wrap {
	width: 48%!important;
	margin: 0 1%;
}
.BA_type2 .box_img1_wrap::before, .BA_type2 .box_img2_wrap::before {
	position: absolute;
	content: "Before";
	width: 121px;
	background-color: #a0a0a0;
	color: #fff;
	text-align: center;
	display: block;
	left: 0;
	bottom: 0;
	margin: auto;
	z-index: 1;
	font-size: 14px;
	letter-spacing: 1px;
	padding: 4px 0px;
	box-sizing: border-box;
}
.BA_type2 .box_img2_wrap::before {
	content: "After";
	background-color: #b2c72b;
}

/* ---------- スマホ ---------- */
@media screen and (max-width: 667px){
.BA_type2 .box_img1_wrap::before, .BA_type2 .box_img2_wrap::before{
	width: 76px;
	font-size: 13px;
}
.BA_type2 .box_img1_wrap::before, .BA_type2 .box_img2_wrap::before{padding: 1px 0px;}
}


/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■コード集サイト■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/



#con1 p {
    margin-bottom: 50px;
    letter-spacing: 1px;}

/* フォントサイズ */
.font_10,.font_10_tb,.font_10_sp{font-size: 11px;}
.font_11,.font_11_tb,.font_11_sp{font-size: 12px;}
.font_12,.font_12_tb,.font_12_sp{font-size: 13px;}
.font_13,.font_13_tb,.font_13_sp{font-size: 14px;}
.font_14,.font_14_tb,.font_14_sp{font-size: 16px;}
.font_15,.font_15_tb,.font_15_sp{font-size: 16px;}
.font_16,.font_16_tb,.font_16_sp{font-size: 17px;}
.font_17,.font_17_tb,.font_17_sp{font-size: 18px;}
.font_18,.font_18_tb,.font_18_sp{font-size: 19px;}
.font_19,.font_19_tb,.font_19_sp{font-size: 20px;}
.font_20,.font_20_tb,.font_20_sp{font-size: 21px;}
.font_21,.font_21_tb,.font_21_sp{font-size: 22px;}
.font_22,.font_22_tb,.font_22_sp{font-size: 23px;}
.font_23,.font_23_tb,.font_23_sp{font-size: 24px;}
.font_24,.font_24_tb,.font_24_sp{font-size: 25px;}
.font_25,.font_25_tb,.font_25_sp{font-size: 26px;}
.font_26,.font_26_tb,.font_26_sp{font-size: 27px;}
.font_27,.font_27_tb,.font_27_sp{font-size: 28px;}
.font_28,.font_28_tb,.font_28_sp{font-size: 29px;}
.font_29,.font_29_tb,.font_29_sp{font-size: 30px;}
.font_30,.font_30_tb,.font_30_sp{font-size: 31px;}
.font_31,.font_31_tb,.font_31_sp{font-size: 32px;}
.font_32,.font_32_tb,.font_32_sp{font-size: 33px;}
.font_33,.font_33_tb,.font_33_sp{font-size: 34px;}
.font_34,.font_34_tb,.font_34_sp{font-size: 35px;}
.font_35,.font_35_tb,.font_35_sp{font-size: 36px;}
.font_36,.font_36_tb,.font_36_sp{font-size: 37px;}
.font_37,.font_37_tb,.font_37_sp{font-size: 38px;}
.font_38,.font_38_tb,.font_38_sp{font-size: 39px;}
.font_39,.font_39_tb,.font_39_sp{font-size: 40px;}
.font_40,.font_40_tb,.font_40_sp{font-size: 41px;}
.font_41,.font_41_tb,.font_41_sp{font-size: 42px;}
.font_42,.font_42_tb,.font_42_sp{font-size: 43px;}
.font_43,.font_43_tb,.font_43_sp{font-size: 44px;}
.font_44,.font_44_tb,.font_44_sp{font-size: 45px;}
.font_45,.font_45_tb,.font_45_sp{font-size: 46px;}
.font_46,.font_46_tb,.font_46_sp{font-size: 47px;}
.font_47,.font_47_tb,.font_47_sp{font-size: 48px;}
.font_48,.font_48_tb,.font_48_sp{font-size: 49px;}
.font_49,.font_49_tb,.font_49_sp{font-size: 50px;}
.font_50,.font_50_tb,.font_50_sp{font-size: 51px;}

/* フォントサイズ 基準値から+- */
.font_100per,.font_100per_tb,.font_100per_sp{font-size:-webkit-calc(1rem + 1px);font-size : calc(1rem + 1px);}
.font_200per,.font_200per_tb,.font_200per_sp{font-size:-webkit-calc(2rem + 1px);font-size : calc(2rem + 1px);}
.font_2up,.font_2up_tb,.font_2up_sp{font-size:-webkit-calc(1rem + 3px);font-size : calc(1rem + 3px);}
.font_4up,.font_4up_tb,.font_4up_sp{font-size:-webkit-calc(1rem + 5px);font-size : calc(1rem + 5px);}
.font_6up,.font_6up_tb,.font_6up_sp{font-size:-webkit-calc(1rem + 7px);font-size : calc(1rem + 7px);}
.font_8up,.font_8up_tb,.font_8up_sp{font-size:-webkit-calc(1rem + 9px);font-size : calc(1rem + 9px);}
.font_10up,.font_10up_tb,.font_10up_sp{font-size:-webkit-calc(1rem + 11px);font-size : calc(1rem + 11px);}
.font_12up,.font_12up_tb,.font_12up_sp{font-size:-webkit-calc(1rem + 13px);font-size : calc(1rem + 13px);}
.font_14up,.font_14up_tb,.font_14up_sp{font-size:-webkit-calc(1rem + 15px);font-size : calc(1rem + 15px);}
.font_2dw,.font_2dw_tb,.font_2dw_sp{font-size:-webkit-calc(1rem - 1px);font-size : calc(1rem - 1px);}
.font_4dw{font-size:-webkit-calc(1rem - 3px);font-size : calc(1rem - 3px);}
.font_6dw{font-size:-webkit-calc(1rem - 5px);font-size : calc(1rem - 5px);}
.font_8dw{font-size:-webkit-calc(1rem - 7px);font-size : calc(1rem - 7px);}





/*20220517*/
.BA_type2 .box_img3_wrap, .BA_type2 .box_img4_wrap {
    width: 48%!important;
    margin: 2% 1% 0;
}

.BA_type2 .box_txt1{padding-top:20px;}

/* ---------- スマホ ---------- */
@media screen and (max-width: 667px){
.BA_type2 .box_txt1 {
    padding-top: 10px;
}}