@charset "UTF-8";
/* CSS Document */ 
:root {
    --c_blue: #002361;
    --r_blue: #b2c8e1;
	--c_gray: #f2f2f2;
    --fz11: clamp(.9rem, 0.71vw, 1.1rem);
    --fz12: clamp(1rem, 0.78vw, 1.2rem);
    --fz13: clamp(1.1rem, 0.84vw, 1.3rem);
    --fz14: clamp(1.1rem, 0.91vw, 1.4rem);
    --fz15: clamp(1.2rem, 0.97vw, 1.5rem);
    --fz16: clamp(1.3rem, 1.04vw, 1.6rem);
    --fz17: clamp(1.3rem, 1.1vw, 1.7rem);
    --fz18: clamp(1.3rem, 1.17vw, 1.8rem);
    --fz19: clamp(1.3rem, 1.23vw, 1.9rem);
    --fz20: clamp(1.3rem, 1.3vw, 2rem);
    --fz21: clamp(1.3rem, 1.36vw, 2.1rem);
    --fz22: clamp(1.3rem, 1.43vw, 2.2rem);
    --fz23: clamp(1.3rem, 1.49vw, 2.3rem);
    --fz24: clamp(1.3rem, 1.56vw, 2.4rem);
    --fz25: clamp(1.3rem, 1.62vw, 2.5rem);
    --fz26: clamp(1.3rem, 1.69vw, 2.6rem);
    --fz27: clamp(1.3rem, 1.75vw, 2.7rem);
    --fz28: clamp(1.3rem, 1.82vw, 2.8rem);
    --fz29: clamp(1.3rem, 1.88vw, 2.9rem);
    --fz30: clamp(1.3rem, 1.95vw, 3rem);
    --fz31: clamp(1.3rem, 2.01vw, 3.1rem);
    --fz32: clamp(1.3rem, 2.08vw, 3.2rem);
    --fz33: clamp(1.3rem, 2.14vw, 3.3rem);
    --fz34: clamp(1.3rem, 2.21vw, 3.4rem);
    --fz35: clamp(1.3rem, 2.27vw, 3.5rem);
    --fz36: clamp(1.3rem, 2.34vw, 3.6rem);
    --fz37: clamp(1.3rem, 2.4vw, 3.7rem);
    --fz38: clamp(1.3rem, 2.47vw, 3.8rem);
    --fz39: clamp(1.3rem, 2.53vw, 3.9rem);
    --fz40: clamp(1.3rem, 2.6vw, 4rem);
    --fz41: clamp(1.3rem, 2.66vw, 4.1rem);
    --fz42: clamp(1.3rem, 2.73vw, 4.2rem);
    --fz43: clamp(1.3rem, 2.79vw, 4.3rem);
    --fz44: clamp(1.3rem, 2.86vw, 4.4rem);
    --fz45: clamp(1.3rem, 2.92vw, 4.5rem);
    --fz46: clamp(1.3rem, 2.99vw, 4.6rem);
    --fz47: clamp(1.3rem, 3.05vw, 4.7rem);
    --fz48: clamp(1.3rem, 3.12vw, 4.8rem);
    --fz49: clamp(1.3rem, 3.18vw, 4.9rem);
    --fz50: clamp(1.3rem, 3.25vw, 5rem);
    --fz51: clamp(1.3rem, 3.31vw, 5.1rem);
    --fz52: clamp(1.3rem, 3.38vw, 5.2rem);
    --fz53: clamp(1.3rem, 3.44vw, 5.3rem);
    --fz54: clamp(1.3rem, 3.51vw, 5.4rem);
    --fz55: clamp(1.3rem, 3.57vw, 5.5rem);
    --num35: clamp(16px, 2.27vw, 35px);
    --num40: clamp(18px, 2.6vw, 40px);
    --num50: clamp(23px, 3.25vw, 50px);
    --num60: clamp(27px, 3.9vw, 60px);
    --num70: clamp(32px, 4.55vw, 70px);
    --num80: clamp(36px, 5.19vw, 80px);
    --num90: clamp(41px, 5.84vw, 90px);
    --num100: clamp(45px, 6.49vw, 100px);
    --num120: clamp(54px, 7.79vw, 120px);
    --num150: clamp(68px, 9.74vw, 150px);
    --num170: clamp(77px, 11.04vw, 170px);
    --num190: clamp(86px, 12.34vw, 190px);
    --num200: clamp(90px, 12.99vw, 200px);
    --num235: clamp(106px, 15.26vw, 235px);
}
@media only screen and (max-width: 768px) {
	:root {
		--fz11: clamp(.9rem, 2.93vw, 1.1rem);
		--fz12: clamp(.9rem, 3.2vw, 1.2rem);
		--fz13: clamp(.9rem, 3.47vw, 1.3rem);
		--fz14: clamp(.9rem, 3.73vw, 1.4rem);
		--fz15: clamp(.9rem, 4vw, 1.5rem);
		--fz16: clamp(.9rem, 4.27vw, 1.6rem);
		--fz17: clamp(.9rem, 4.53vw, 1.7rem);
		--fz18: clamp(.9rem, 4.8vw, 1.8rem);
		--fz19: clamp(.9rem, 5.07vw, 1.9rem);
		--fz20: clamp(.9rem, 5.33vw, 2rem);
		--fz21: clamp(.9rem, 5.6vw, 2.1rem);
		--fz22: clamp(.9rem, 5.87vw, 2.2rem);
		--fz23: clamp(.9rem, 6.13vw, 2.3rem);
		--fz24: clamp(.9rem, 6.4vw, 2.4rem);
		--fz25: clamp(.9rem, 6.67vw, 2.5rem);
		--fz26: clamp(.9rem, 6.93vw, 2.6rem);
		--fz27: clamp(.9rem, 7.2vw, 2.7rem);
		--fz28: clamp(.9rem, 7.47vw, 2.8rem);
		--fz29: clamp(.9rem, 7.73vw, 2.9rem);
		--fz30: clamp(.9rem, 8vw, 3rem);
		--fz31: clamp(.9rem, 8.27vw, 3.1rem);
		--fz32: clamp(.9rem, 8.53vw, 3.2rem);
		--fz33: clamp(.9rem, 8.8vw, 3.3rem);
		--fz34: clamp(.9rem, 9.07vw, 3.4rem);
		--fz35: clamp(.9rem, 9.33vw, 3.5rem);
		--fz36: clamp(.9rem, 9.6vw, 3.6rem);
		--fz37: clamp(.9rem, 9.87vw, 3.7rem);
		--fz38: clamp(.9rem, 10.13vw, 3.8rem);
		--fz39: clamp(.9rem, 10.4vw, 3.9rem);
		--fz40: clamp(.9rem, 10.67vw, 4rem);
		--fz41: clamp(.9rem, 10.93vw, 4.1rem);
		--fz42: clamp(.9rem, 11.2vw, 4.2rem);
		--fz43: clamp(.9rem, 11.47vw, 4.3rem);
		--fz44: clamp(.9rem, 11.73vw, 4.4rem);
		--fz45: clamp(.9rem, 12vw, 4.5rem);
		--fz46: clamp(.9rem, 12.27vw, 4.6rem);
		--fz47: clamp(.9rem, 12.53vw, 4.7rem);
		--fz48: clamp(.9rem, 12.8vw, 4.8rem);
		--fz49: clamp(.9rem, 13.07vw, 4.9rem);
		--fz50: clamp(.9rem, 13.33vw, 5rem);
		--fz51: clamp(.9rem, 13.6vw, 5.1rem);
		--fz52: clamp(.9rem, 13.87vw, 5.2rem);
		--fz53: clamp(.9rem, 14.13vw, 5.3rem);
		--fz54: clamp(.9rem, 14.4vw, 5.4rem);
		--fz55: clamp(.9rem, 14.67vw, 5.5rem);	
	}
}

/*header*/
.l-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: transparent;
    transition: all .3s ease;
    z-index: 99;
}
.l-header.second {
    height: 120px;
}
.l-header.second.h_fixed {
    height: 100px;
}
.l-header::before, .l-header::after {
    opacity: 0;
    content: '';
    position: absolute;
    top: calc(100% - .3vw);
    left: calc(50% - 1px);
    display: block;
    width: calc(100% + 1px);
    height: 5vw;
    background-image: url("https://dev.hi5.jp/wp-content/themes/highfive/images/h_shape.svg");
    background-position: center top;
    background-size: calc(100% + 4px) auto;
    background-repeat: no-repeat;
    pointer-events: none;
    transform: translateX(-50%);
    transition: all .3s ease;
    z-index: -1;
}
.l-header::after {
    background-position: center top 2px;
    background-size: 100% auto;
    filter: brightness(0) saturate(100%) invert(100%) sepia(1%) saturate(1805%) hue-rotate(144deg) brightness(115%) contrast(100%);
    z-index: -2;
}
.l-header.h_fixed::before, .l-header.h_fixed::after, .l-header.second::before, .l-header.second::after {
    opacity: 1;
}
.l-header .global {
    overflow: hidden;
}
.l-header.second .global {
    margin-top: 20px;
    transition: all .3s ease;
}
.l-header.second.h_fixed .global {
    margin-top: 0;
}
.l-header.h_fixed, .l-header.second {
    background: #002361;
}
.l-header h1 {
    opacity: 1;
    transition: all .5s ease;
}
.l-header.h_fixed h1, .l-header.second h1 {
    opacity: 0;
    pointer-events: none;
}
.l-header .fixed_logo {
    opacity: 0;
    display: block;
    height: 74%;
    margin-left: 55px;
    transition: all .5s ease;
}
.l-header .fixed_logo > img {
    display: block;
    height: 100%;
}
.l-header.h_fixed .fixed_logo, .l-header.second .fixed_logo {
    opacity: 1;
}
.l-header .global ul li a {
    border: 2px solid #f4f4f4;
}
.l-header.h_fixed .global ul li a, .l-header.second .global ul li a {
    color: #fff;
    background: #002361;
    border-color: #fff;
}
/*hamburger*/
.hmbg_btn {
    position: relative;
    display: none;
    margin-right: 20px;
    margin-left: auto;
    cursor: pointer;
    z-index: 2;
    --ham_num: 10px;
    --ham_mnum: -10px;
}
.hmbg_inner {
    position: relative;
    width: 30px;
    height: 3px;
    margin-top: var(--ham_num);
    margin-bottom: var(--ham_num);
    background: var(--c_blue);
    border-radius: 9999px;
    transition: all .5s ease;
}
.h_fixed .hmbg_inner, .h_fixed .hmbg_inner::before, .h_fixed .hmbg_inner::after, .second .hmbg_inner, .second .hmbg_inner::before, .second .hmbg_inner::after {
    background: #fff;
}
.hmbg_wrap.open .hmbg_inner, .hmbg_wrap.open.second .hmbg_inner, .hmbg_wrap.open.h_fixed .hmbg_inner {
    background: transparent;
}
.hmbg_inner::before, .hmbg_inner::after {
    content: '';
    position: absolute;
    left: 0;
    display: block;
    width: 100%;
    height: 3px;
    background: var(--c_blue);
    border-radius: 9999px;
}
.hmbg_inner::before {
    top: var(--ham_mnum);
    transition: all .5s ease;
}
.hmbg_inner::after {
    bottom: var(--ham_mnum);
    transition: all .5s ease;
}
.hmbg_wrap.open .hmbg_inner::before {
    background: #fff;
    transform: translateY(var(--ham_num)) rotate(45deg);
}
.hmbg_wrap.open .hmbg_inner::after {
    background: #fff;
    transform: translateY(var(--ham_mnum)) rotate(-45deg);
}
html.hmbg_open {
    overflow: hidden;
}
#sp_nav {
    opacity: 0;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
	padding-bottom: 10vh;
    background: var(--c_blue);
    overflow: auto;
    pointer-events: none;
    transition: all .5s ease;
    z-index: 1;
}
.hmbg_wrap.open #sp_nav {
    opacity: 1;
    pointer-events: auto;
}
.sp_nav_inner {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    min-height: 100%;
    padding-top: 12vw;
}
.sp_nav_inner > * {
    position: relative;
    z-index: 1;
}
.sp_nav_li {
    width: 70%;
    margin: 0 auto 15px;
    list-style: none;
}
.sp_nav_li > li {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    margin-bottom: 2em;
    font-size: var(--fz15);
}
.sp_nav_li a {
    position: relative;
    display: block;
    color: #fff;
    font-size: 1em;
    font-weight: 500;
    letter-spacing: .08em;
    line-height: 1;
    transition: all .3s ease;
}
.sp_nav_li a:hover {
    opacity: .6;
}
.sp_nav_li > li.active a::before {
    content: '';
    position: absolute;
    top: 50%;
    right: calc(100% + .6em);
    display: block;
    width: 2px;
    height: 100%;
    background: #fc900d;
    transform: translateY(-50%);
}
.sp_nav_li a > span {
    display: block;
    margin-bottom: .3em;
    font-size: 1.7em;
    font-weight: 900;
}
.sp_nav_li li:last-of-type, .sp_nav_sub li:last-of-type {
    border-bottom: none;
}
.sp_nav_li li {
    opacity: 0;
    transition: all .5s ease;
    transform: translateY(20px);
}
.hmbg_wrap.open .sp_nav_li li {
    opacity: 1;
    transform: translateY(0);
}
.sp_nav_li_s {
    margin: .3em 0 .5em 1em;
    list-style: none;
}
.sp_nav_li_s > li {
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}
.sp_nav_li_s a {
    font-size: .93em;
}
.sp_nav_li_s a::before {
    content: '-';
    margin-right: .3em;
}
.sp_nav_inner .btn_wrap {
    justify-content: space-between;
    margin-top: 2.5vw;
    margin-bottom: 6vw;
}
.sp_nav_inner .btn_wrap > a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 48%;
    padding: 1.2em 1em;
    color: #fff;
    font-size: var(--fz26);
    font-weight: 500;
    border-radius: .5em;
}
.hmbg_num {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    padding: clamp(15px, 6vw, 30px) 4vw;
    margin-top: auto;
    line-height: 1;
    background: #fff;
}
.hmbg_num .number {
    color: var(--c_blue);
    font-size: var(--fz34);
    font-weight: 700;
}
.hmbg_num .number .tel {
    font-size: 1.77em;
}
.hmbg_num .number .tel > a {
    color: var(--c_blue);
    font-size: 1em;
}
.hmbg_num .time {
    margin-top: .5em;
    font-size: var(--fz18);
}
.hmbg_num .tac {
    display: block;
    width: auto;
    padding: 1em 2.5em;
    margin-top: 1.2em;
    color: #fff;
    font-size: var(--fz32);
    font-weight: 500;
    text-align: center;
    background: var(--c_blue);
    border-radius: .3em;
}
.hmbg_num .tac small {
    display: block;
    margin-top: .5em;
    font-size: .75em;
    font-weight: 400;
}
@media only screen and (max-width: 768px) {
    .l-header.second, .l-header.h_fixed {
        align-items: center;
        padding: 15px 0;
        height: 74px;
    }
    .l-header.second.h_fixed, .l-header.h_fixed {
        height: 64px;
    }
    .l-header.second .fixed_logo, .l-header .fixed_logo {
        margin-left: 20px;
    }
    .hmbg_btn {
        display: block;
    }
    .l-header::before, .l-header::after {
        display: none;
    }
}
/*//hamburger*/
/*header*/

/*works*/
.search_box {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    max-width: 11120px;
    width: 82%;
    margin: 0 auto var(--num90);
}
.search_box .h {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: auto;
    padding: 1em 3em 1.2em;
    color: #fff;
    font-size: var(--fz20);
    font-weight: 700;
    line-height: 1;
    background: var(--c_blue);
    border-radius: 20px 20px 0 0;
}
.search_box .h::before {
    content: '\f002';
    margin-right: .5em;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}
.search_box form {
    width: 100%;
    padding: var(--num50) 4%;
    color: #fff;
    background: var(--c_blue);
    border-radius: 0 20px 20px 20px;
}
.search_box form > ul {
    display: grid;
    grid-auto-flow: column;
    grid-template-rows: repeat(2, auto);
}
.search_box form > ul > li {
    padding: 0;
}
.search_box form > ul > li.sf-field-taxonomy-works_site, .search_box form > ul > li.sf-field-taxonomy-works_other {
	padding-right: 3%;
    margin-right: 6%;
    border-right: 1px solid #fff;
}
.sf-field-taxonomy-works_site h4, .sf-field-taxonomy-works_other h4 {
    margin-bottom: .3em;
    font-size: var(--fz45);
    font-weight: 900;
    line-height: 1;
}
.sf-field-taxonomy-works_other h4 {
    margin-top: .8em;
}
li[data-sf-field-input-type="checkbox"] > ul {
    display: flex;
	flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
}
li[data-sf-field-input-type="checkbox"] > ul > li {
    position: relative;
    width: auto;
    padding: 1em 1.5em;
    margin-bottom: .5em;
    color: #fff;
    font-weight: 700;
    line-height: 1;
    border: 1px solid #fff;
    border-radius: 9999px;
    transition: all .3s ease;
    overflow: hidden;
}
li[data-sf-field-input-type="checkbox"] > ul > li:has(input:checked), li[data-sf-field-input-type="checkbox"] > ul > li:hover {
    color: var(--c_blue);
    background: #fff;
}
li[data-sf-field-input-type="checkbox"] > ul > li + li {
    margin-left: .5em;
}
li[data-sf-field-input-type="checkbox"] > ul > li > input {
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    cursor: pointer;
}
.search_box li[data-sf-field-input-type="checkbox"] > ul > li > label {
    padding-left: 0;
}
.sf-field-taxonomy-works_cate h4 {
    font-size: var(--fz26);
    font-weight: 700;
}
.archive_works {
    max-width: 11120px;
    width: 82%;
    margin: auto;
}
.archive_works_li {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    margin-bottom: var(--num100);
    column-gap: 8%;
}
.archive_works_li .item {
    width: 28%;
}
.archive_works_li a {
    opacity: 1;
    display: block;
    width: 100%;
    transition: all .3s ease;
}
.archive_works_li .img {
    position: relative;
    width: 100%;
    padding-top: 62.5%;
    border-radius: 15px;
    overflow: hidden;
}
.archive_works_li .img > img {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: translate(-50%, -50%) scale(1);
    transition: all .3s ease;
}
.archive_works_li .cont {
    width: 100%;
}
.works_cat {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    margin-top: 1em;
    font-size: var(--fz14);
}
.works_cat > span {
    display: block;
    width: auto;
    padding: .5em 1em;
	margin-right: .5em;
    margin-bottom: .5em;
    line-height: 1;
    border: 2px solid;
    border-radius: 9999px;
}
.works_cat > span.cat_site {
    color: var(--c_blue);
    background: #fff;
    border-color: var(--c_blue);
}
.works_cat > span.cat_type {
    color: var(--c_blue);
    background: var(--r_blue);
    border-color: var(--r_blue);
}
.archive_works_li .tit {
    width: 100%;
    margin: 1em 0;
    color: var(--c_blue);
    font-size: var(--fz20);
    font-weight: 700;
    text-align: center;
}
.archive_works .post_none {
    width: 100%;
    margin-bottom: var(--num100);
    font-size: var(--fz16);
    text-align: center;
}
#works_single {
    position: static;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    padding-top: var(--num170);
}
#works_single .works_info {
    position: sticky;
    top: 0;
    left: 0;
    width: 30%;
    padding: 4% 0;
    color: #fff;
    background: var(--c_blue);
    border-radius: 0 20px 20px 0;
}
#works_single .works_info .inner {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    max-width: 270px;
    width: 88%;
    margin: auto;
}
#works_single .works_info .name {
    display: block;
    width: 100%;
    margin-bottom: .6em;
    font-size: var(--fz32);
    font-weight: 700;
    line-height: 1;
}
#works_single .works_info .name > span {
    display: block;
}
#works_single .works_info .name .company {
    margin-bottom: 1em;
    font-size: .66em;
    font-weight: 600;
}
#works_single .works_info .name .site {
    position: relative;
    line-height: 1.4;
}
#works_single .works_info .name .site::before {
    content: '';
    position: absolute;
    top: 50%;
    left: -1em;
    display: block;
    width: 2px;
    height: 90%;
    background: #fff;
    transform: translateY(-50%);
}
#works_single .works_info .url {
    opacity: 1;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    margin-bottom: 1em;
    color: var(--r_blue);
    font-size: var(--fz14);
    font-weight: 700;
    line-height: 1.4;
    transition: all .3s ease;
}
#works_single .works_info .url:hover {
    opacity: .6;
}
#works_single .works_info .url::before {
    content: '\f109';
    margin-right: .5em;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}
#works_single .works_info .url > span {
    text-decoration: underline;
}
#works_single .works_cat {
    margin-bottom: 2em;
}
#works_single .specification_li {
    padding-left: 1.3em;
    font-size: 1em;
    list-style: disc;
}
#works_single .back {
    display: block;
    width: 100%;
    padding: 1em;
    margin-top: 1.5em;
    color: var(--c_blue);
    font-size: var(--fz18);
    font-weight: 700;
    text-align: center;
    background: #fff;
    border: 2px solid #fff;
    border-radius: 9999px;
    transition: all .3s ease;
}
#works_single .back:hover {
    color: #fff;
    background: var(--c_blue);
}
#works_single .works_cont {
    width: 70%;
    padding: 4%;
    background: var(--c_gray);
    border-radius: 20px 0 0 20px;
}
#works_single .works_cont > img {
    border-radius: 15px;
}
.works_single_wrapper .btn_wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 92%;
    margin: var(--num120) auto var(--num150);
}
.works_single_wrapper .btn_wrap > a {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 245px;
    width: 100%;
    padding: .5em;
    color: #fff;
    font-size: var(--fz20);
    font-weight: 700;
    text-align: center;
    background: var(--c_blue);
    border: 2px solid var(--c_blue);
    border-radius: 9999px;
    transition: all .3s ease;
}
.works_single_wrapper .btn_wrap > a:hover {
    color: var(--c_blue);
    background: #fff;
}
#works_other {
    width: 100%;
}
#works_other .sec_tit {
    max-width: 1340px;
    width: 92%;
    margin: 0 auto .7em;
    color: var(--c_blue);
    font-size: clamp(1.3rem, 6.49vw, 10rem);
    font-weight: 900;
    line-height: 1;
}
.archive_works_slide .archive_works_li .item {
    width: 310px;
    margin: 0 55px;
}
.archive_works_li.swiper-wrapper {
    flex-wrap: nowrap;
    column-gap: 0;
}
.archive_works_slide + .arrow_wrap {
    display: flex;
    justify-content: center;
    align-items: center;
}
.swiper-button-prev.archive_works_prev, .swiper-button-next.archive_works_next {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 45px;
    height: 45px;
    margin: 0 10px;
    color: #fff;
    line-height: 1;
    background: var(--c_blue);
    border: 1px solid var(--c_blue);
    border-radius: 50%;
    transition: all .3s ease;
}
.swiper-button-prev.archive_works_prev::after, .swiper-button-next.archive_works_next::after {
    display: none;
}
.swiper-button-prev.archive_works_prev::before {
    content: '\f053';
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}
.swiper-button-next.archive_works_next::before {
    content: '\f054';
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}
.widget_search_filter_register_widget {
    list-style: none;
}
@media only screen and (max-width: 850px) {
	.archive_works {
		width: 92%;
	}
	.archive_works_li .item {
		width: 46%;
	}
}
@media only screen and (max-width: 768px) {
	#works_single {
		position: relative;
		flex-direction: column;
	}
	#works_single .works_info {
		position: relative;
		width: 96%;
		padding: 8% 0;
	}
	#works_single .works_info .inner {
		max-width: inherit;
		width: 84%;
	}
	#works_single .works_info .name .site::before {
		left: -.3em;
	}
	#works_single .back {
		display: none;
	}
	#works_single .works_info .name .company {
		margin-bottom: .3em;
	}
	#works_single .works_info .name {
		font-size: var(--fz25);
	}
	#works_single .works_cat {
		margin-top: .3em;
		margin-bottom: 1em;
	}
	#works_single .works_cont {
		width: 100%;
		padding: 5%;
		margin-top: 6%;
	}
	.works_single_wrapper .btn_wrap > a {
		max-width: 160px;
		font-size: var(--fz18);
	}
	.archive_works_slide .archive_works_li .item {
		width: 70vw;
		margin: 0 2.5vw;
	}
	#works_other .sec_tit {
		font-size: clamp(1.3rem, 12vw, 10rem);
		text-align: center;
	}
	#works_other .archive_works_li .tit {
		margin-bottom: 0;
	}
}
@media only screen and (max-width: 550px) {
	.archive_works_li .item {
		width: 100%;
	}
	.archive_works_li .tit {
		margin: .3em 0 2em;
	}
}
/*//works*/