@charset "utf-8";
/*
Theme Name: Linkwin
Theme URI: https://linkwin.jp
*/


/* COMMON  */

:root {
	--color-main: #191f4d;
	--color-blue: #0349ab;
	--color-gray: #f8f8f8;
	--color-gray_d: #eee;
	--color-blue_u: #eaf0f8;
	
	--ff-main: "Urbanist","Noto Sans JP", sans-serif;
	--ff-noto: "Noto Sans JP", sans-serif;
	--ff-en: "Barlow Condensed", sans-serif;
	--ff-en: "Roboto Condensed", sans-serif;
}

html{
   font-size: 16px;
}

body {
  font-family: var(--ff-main);
  font-weight: 400;
  font-style: normal;
  color: var(--color-main);
  line-height: 1.7;
  letter-spacing: 0.5px;
  position: relative;
  -webkit-font-smoothing:antialiased;
}

main {
	font-size: 1rem;
}
img{
	height:auto;
	max-width:100%;
	vertical-align: bottom;
}
strong {
	font-weight: 900;
}
main a,
main a:hover {
	transition: all 0.5s;
	color: var(--color-blue);
}
ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
p:empty {
    display: none;
}
.color-wh {
	color:#fff !important;
}
.color-bk {
	color: var(--color-main) !important;
}
.color-blue {
	color: var(--color-blue) !important;
}
.ff-en {
	font-family: var(--ff-en);
}
.fs-ss {
	font-size: 0.75rem;
}
.fs-s {
	font-size: 0.875rem;
}
.fs-m {
	font-size: 1rem;
}
.fs-l {
	font-size: 1.125rem;
}
.fs-ll {
	font-size: 1.25rem;
}
.fw-b {
	font-weight: bold;
}
.bg-bk {
	background-color:var(--color-main);
}
.bg-gray {
	background-color:var(--color-gray);
}
.bg-white {
	background-color:#fff;
}
.txt-right {
	text-align: right;	
}
.txt-center {
	text-align: center;	
}
.mb-0 {
	margin-bottom: 0 !important;
}
.mb-1 {
	margin-bottom: 1rem !important;
}
.mb-2 {
	margin-bottom: 2rem !important;
}
.mb-3 {
	margin-bottom: 3rem !important;
}
.p-2 {
	padding: 2rem;
}

.sp {
	display: none !important;
}

@media screen and (max-width:767px){

html{
   font-size: 14px;
}
.pc {
	display: none;		
}
.sp {
	display: block !important;	
}

}

.inner {
	width: 80vw;
	margin: 0 auto;
	position: relative;
}
.inner-s {
	width: 70vw;
	margin: 0 auto;
	position: relative;
}

.home h2 {
	font-size: 2rem;
	line-height: 1;
	margin: 0 0 2rem;
}
h2.en,
h3.en {
	font-size: 3.25rem !important;
	font-family: var(--ff-en);
	letter-spacing: 0.05em;
	white-space: nowrap;
}
h2.en.en-s {
	font-size: 2.75rem;
}
.center-item {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0;
}
.link-btn,
.link-btn__s {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1.5rem 1.5rem;
	width: 100%;
	min-width: 12rem;
	max-width: 20rem;
	background: var(--color-main);
	color: #fff !important;
	text-decoration: none;
	font-weight: 600;
	box-sizing: border-box;
	transition: 0.5s;
}
.link-btn__s {
	padding: 0.75rem 1.5rem;
	font-size: 0.9rem;
}
.link-btn:after,
.link-btn__s:after {
	content: "";
	display: block;
	width: 0.8rem;
	height: 0.8rem;
	background: url(assets/images/arrow-white.svg) no-repeat center center / contain;
	transition: 0.5s;
}
.link-btn__s:after {
	width: 0.7rem;
	height: 0.7rem;
}
.link-btn:hover,
.link-btn__s:hover {
	background: var(--color-blue);
}
.link-btn:hover:after,
.link-btn__s:hover:after {
	transform: translateX(3px);
}

ul.list-normal li {
	padding: 0.5rem 0 0.5rem 1.5rem;
	position: relative;
}
ul.list-normal li:before{
	content: "・";
	position: absolute;
	top:0.5rem;
	left:0;
	display: block;
  }
ol.ol-normal {
	padding: 0;
}
ol.ol-normal li {
  list-style-type: none;
  counter-increment: cnt;
  position: relative;
  padding-left: 3rem;
}

ol.ol-normal li:before {
  content: "（"counter(cnt)"）";
  position: absolute;
  top:0;
  left:0;
  display: block;
}

.content {
	max-width: 900px;
	margin-left: auto;
	margin-right: auto;
}
.content_l {
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
}
.content_m {
	max-width: 700px;
	margin-left: auto;
	margin-right: auto;
}
.content_s {
	max-width: 600px;
	margin-left: auto;
	margin-right: auto;
}

@media screen and (min-width: 768px) {
	a[href^="tel:"] {
  		pointer-events: none;
	}  
}

@media screen and (max-width: 767px) {
	.inner-s {
		width: 80vw;
	}
}




/* HEADER  */

header {
	width: 100%;
	position: fixed;
	z-index: 200;
/*	overflow: hidden;*/
	background: #fff;
	transition: 0.5s;
}
.home header {
	background: transparent;
}
.home header.is-scrolled {
	background: #fff;
}
.header-content {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.header-logo {
	margin-left: 5vw;
	width: 10rem;
	background: none;
}
.header-logo h1 {
	margin: 0;
	padding: 0;
	line-height: 1;
}
.home .header-logo {
	background: url(assets/images/linkwin-logo-bgbk.svg) no-repeat center center / contain;
}
.home .header-logo img {
	visibility: hidden;
}
.home .is-scrolled .header-logo {
	background: none;
}
.home .is-scrolled .header-logo img {
	visibility: visible;
}
.header-nav .menu {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 0 2.5rem;
	margin: 0;
}
.header-nav .menu a {
   text-decoration: none;
   color: var(--color-main);
   transition:all .3s;
   position: relative;
   letter-spacing: 0.1em;
	font-family: var(--ff-en);
	font-weight: 600;
	font-size: 1rem;
	display: block;
	padding: 1rem 0;
	white-space: nowrap
}
.header-nav .menu a:after {
	content: "";
    display: block;
    width: 0;
    height: 2px;
    background: var(--color-main);
    position: absolute;
    left: 0;
    bottom: 0.5rem;
	transition: 0.5s;
}
.home .header-nav .menu a:after {
    background: #fff;
}
.home .is-scrolled .header-nav .menu a:after {
    background: var(--color-main);
}

.header-nav .menu a:hover:after {
    width: 2.5rem;
}
.home .header-nav .menu a {
	color: #fff;
}
.home .is-scrolled .header-nav .menu a {
   color: var(--color-main);
}
/* 下層メニュー */
.header-nav .menu .menu-item-has-children{
	position: relative;
}
.header-nav .menu .menu-item-has-children a:after {
	content: none;
}
.header-nav .menu-item-has-children .sub-menu {
    display: flex;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateX(10px);

  transition:
    opacity 0.5s ease,
    transform 0.5s ease,
    visibility 0s linear 0.5s;

	position: absolute;
	bottom: -5rem;
	right: 0;
	background: var(--color-blue_u);
	padding: 1rem 2rem;
	border-radius: 0.5rem;
}
.header-nav .menu-item-has-children.active .sub-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(0);

  transition:
    opacity 0.5s ease,
    transform 0.5s ease,
    visibility 0s linear 0s;
}

.header-nav .menu .sub-menu li {
	display: flex;
	align-items: center;
}
.header-nav .menu .sub-menu li a {
	font-size: 0.8rem;
	color: var(--color-main);
}
.header-nav .menu .sub-menu li + li:before {
	content: "/";
	margin: 0 1rem;
	opacity: 0.5;
}
.header-nav .menu .sub-menu li a:hover {
	opacity: 0.6
}
/* contactボタン */
.header-nav .menu .header-nav-contact a {
	background: var(--color-main);
	color: #fff !important;
	padding-left: 2rem;
	padding-right: 2rem;
	transition: 0.5s;
}
.header-nav .menu .header-nav-contact a:hover {
	background: var(--color-blue);
}
.header-nav .menu .header-nav-contact a:after {
	content: none !important;
}
/* spボタン */
.nav-btn {
	display: none;
}


@media screen and (max-width:991px){

	header {
		width: 100%;
		height: 55px;
	}
	.header-logo {
		position: absolute;
		left: 5vw;
		top: 0.75rem;
		margin: 0;
		z-index: 9999;
	}
	.active .header-logo {
		background: url(assets/images/linkwin-logo-bgbk.svg) no-repeat center center / contain !important;
	}
	.active .header-logo img {
		visibility: hidden !important;
	}
	.header-nav {
        position: fixed;
        z-index: -100;
        opacity: 0;
        top: 0;
        width: 100%;
        height: 100vh;
        background: var(--color-main);
        display: none;
	}
	.header-nav::-webkit-scrollbar{
		display:none;
  	}
	#header.active .header-nav {
		display: block;
  		z-index:1000;
  		opacity: 1;
		animation: spnavOpen 0.5s forwards;
	}
	@keyframes spnavOpen{
  		from {
  			opacity: 0;
			transform: translateY(-100px);
  		}
  		to {
 		 	opacity: 1;
			transform: translateY(0);
  		}
	}
	.header-nav .menu {
		flex-direction: column;
		align-items: flex-start;
		padding: 80px 10vw 0 10vw;
	}
	.header-nav .menu > li {
        border-bottom: 1px solid #ffffff55;
        width: 100%;
	}
	.header-nav .menu > li > a {
		color: #fff;
		font-size: 1.5rem;
		padding: 1.2rem 0;
	}
	.header-nav .menu a:after {
		content: none;
	}

	  .header-nav .menu-item-has-children .sub-menu {
    	display: flex;
    flex-wrap: wrap;
    position: static;
    width: 100%;

    max-height: 0;
    overflow: hidden;

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    padding: 0;
	background: none;
	
/*
    transition:
      max-height 0.5s ease,
      opacity 0.8s ease,
      visibility 0s linear 0.8s;*/
  }

  .header-nav .menu-item-has-children.active .sub-menu {
    max-height: 500px;
	  padding-bottom: 2rem;

    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);


	  transition:
      max-height 1.5s ease,
      opacity 1.8s ease,
      visibility 0s linear 0s;
  }
	.header-nav .menu-item-has-children .sub-menu li {
		flex-basis: 40%;
	}
	.header-nav .menu .sub-menu li + li:before{
		content: none;
	}
	.header-nav .menu-item-has-children.active .sub-menu li a {
		padding: 0.25rem;
		color: #fff;
	}


	.header-nav .menu .header-nav-contact {
		border: 0;		
	}
	.header-nav .menu .header-nav-contact a {
		background: #fff;
		color: var(--color-main) !important;
		text-align: center;
		margin: 2rem;
	}
	.header-nav .menu .header-nav-contact a:hover {
		background: #fff;
	}
	
	.nav-btn {
		display: block;
		position: absolute;
	  	top: 5px;
	  	right: 0;
		background:transparent;
		cursor: pointer;
	  	width: 60px;
	  	height:50px;
	  	z-index: 99999;
	  transition: all .4s;
  	}
	.nav-btn span{
	  	display: inline-block;
	  	transition: all .4s;
	  	position: absolute;
	  	left: 0;
		background: #fff;
	  	width: 60%;
	  	height: 3px;
	}
	.subpage .nav-btn span{
		background: var(--color-main);
	}
	.nav-btn span:nth-of-type(1) {
		top:15px; 
  	}
	.nav-btn span:nth-of-type(2) {
		top:30px;
  	}
  	.nav-btn.active .openbtn_inner{
		transform: rotateY(-360deg);
  	}
	.nav-btn.active span:nth-of-type(1) {
		top: 18px;
	  	left: 0;
	  	transform: translateY(6px) rotate(-135deg);
	  	width: 60%;
	  	background: #fff !important;
  	}
	.nav-btn.active span:nth-of-type(2){
	  	top: 30px;
	  	left: 0;
	  	transform: translateY(-6px) rotate(135deg);
	  	width: 60%;
		background: #fff !important;
  	}
	.home .is-scrolled .nav-btn span{
		background: var(--color-main);
  	}
	.home .is-scrolled .header-nav ul#menu-header-menu a {
	   color: #fff;
	}
	.sub .nav-btn span{
		background: var(--color-main);
	}
}






/* FOOTER */

footer {
	position: relative;
	overflow: hidden;
	background: var(--color-main);
}
footer,
footer a {
	color: #fff;
}
.footer-content {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 2rem 0;
}
.footer-content .footer-info {
	flex-basis: 25%;
}
.footer-logo {
	text-align: center;
	padding: 0 0 2rem 0;
	border-bottom: 1px solid #ffffff33;
}
.footer-logo img {
	width: 6rem;
}
.footer-name {
	font-weight: bold;
	margin-bottom: 2rem;
	font-size: 1.125rem;
}
.footer-address dt {
	font-weight: bold;
	font-size: 0.9rem;
}
.footer-address dd {
	font-size: 0.8rem;
	margin: 0 0 0 1rem;
}
.footer-address dd + dt {
	margin-top: 1.5rem;
}
.footer-content .footer-nav {
	flex-basis: 70%;
	display: flex;
	justify-content: flex-end;
	gap: 0 7%;
}
.footer-content .footer-nav ul li a {
	text-decoration: none;
	font-size: 0.85rem;
}
.footer-content .footer-nav ul li:first-child {
	margin-bottom: 1rem;
}
.footer-content .footer-nav ul li:first-child a {
	font-weight: bold;
	font-size: 1rem;
}
.footer-content .footer-nav ul li:not(:first-child) {
	padding: 0.5rem 0 0.5rem 1rem;
}
.footer-content .footer-nav ul li:not(:first-child) a {
	display: flex;
	align-items: center;
}
.footer-content .footer-nav ul li:not(:first-child) a:before {
	content: "-";
	color: #ffffff88;
	margin: 0 0.5rem 0 0;
}
.footer-bottom {
	background: #13162d;
	padding: 0.5rem;
}
.footer-bottom .inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 0 1rem;
}
.footer-bottom .footer-nav04 ul{
	display: flex;
	gap: 0 1.5rem;
}
.footer-bottom .footer-nav04 ul li a {
	text-decoration: none;
	font-size: 0.8rem;
}
.footer-copy {
	font-size: 0.8rem;
	text-align: right;
}

@media screen and (max-width: 767px) {
	
	.footer-content {
		flex-direction: column;
	}
	.footer-content .footer-nav {
		flex-wrap: wrap;
		gap: 0 2%;
	}
	.footer-content .footer-nav .footer-nav01 {
		flex-basis: 40%;
	}
	.footer-content .footer-nav .footer-nav02 {
		flex-basis: 58%;
		margin-bottom: 2rem;
	}
	.footer-content .footer-nav .footer-nav03 {
		flex-basis: 100%;
	}
	.footer-content .footer-info {
		margin: 0 0 2rem 0;
		padding: 0 0 1rem 0;
	    border-bottom: 1px solid #ffffff33;
	}
	.footer-content .footer-nav ul li:not(:first-child) {
		padding-left: 0.5rem;
	}
	.footer-bottom .inner {
		flex-direction: column;
    	align-items: flex-start;
		padding: 1rem 0 0.5rem 0.5rem;
	}
	.footer-bottom .footer-nav04 ul {
		flex-direction: column;
	}
}



/* footer-contact */

.footer-contact {
	background: url(../../uploads/2026/10/company-team-web-office.webp) no-repeat center center / cover;
	overflow: hidden;
	position: relative;
}
.footer-contact:before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: #00000f99;
	position: absolute;
	top: 0;
	left: 0;
}
.footer-contact .inner {
	padding: 5rem 0;
}
.footer-contact h2 {
	color: #fff;
	text-align: center;
	line-height: 1;
	margin: 0 0 2rem;
}
.footer-contact .txt-lead {
	color: #fff;
	text-align: center;
	margin-bottom: 3rem;
}
.footer-contact .contact-content {
	display: flex;
	justify-content: center;
	align-items: flex-start;
	width: 90%;
	margin: 0 auto;
	max-width: 900px;
	gap: 0 3rem;
}
.footer-contact .contact-content > div {
	flex: 1;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}
.footer-contact .contact-content h3 {
	color: #fff;
	text-align: center;
	font-size: 1.5rem;
	line-height: 1;
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	margin: 0 0 1rem;
}
.footer-contact .contact-content h3:after {
	content: "";
	display: block;
	width: 3rem;
	height: 1px;
	background: #ffffff99;
	margin-top: 1.5rem;
}
.footer-contact .contact-content h3 + p {
	width: 100%;
}
.footer-contact .contact-btn {
	display: flex;
	justify-content: center;
	align-items: center;
	color: #fff;
	padding: 1rem;
	border: 2px solid;
	width: 85%;
	max-width: 400px;
	font-size: 1.25rem;
	font-weight: bold;
	letter-spacing: 0.1em;
	transition: 0.5s;
	margin: 0 auto;
	text-decoration: none;
}
.footer-contact .contact-btn:hover {
	background: #fff;
	color: var(--color-main);
}
.txt-tel a {
	display: block;
	text-align: center;
	color: #fff;
	font-size: 2.5rem;
	font-weight: bold;
	text-decoration: none;
	line-height: 1;
	margin: 0 0 0.5rem;
}
.txt-tel small {
	display: block;
	text-align: center;
	color: #fff;
	font-size: 0.8rem;
}

@media screen and (max-width: 767px) {
	
	.footer-contact .inner {
    	padding: 5rem 0 3rem;
	}
	.footer-contact .contact-content {
		flex-direction: column;
		align-items: center;
	}
	.footer-contact .contact-content > div {
		width: 100%;
		margin-bottom: 3rem;
	}
}



/* scroll animate */

.animate {
  opacity: 0;
  transition: all 2s ease 0s;
}
.animate.show {
  opacity: 1 !important;
  transform: none !important;
  filter: blur(0) !important;
}
.animate.fadeUp {
  transform: translateY(24px);
}
.animate.fadeDown {
  transform: translateY(-24px);
}
.animate.fadetoLeft {
  transform: translateX(16px);
}
.animate.fadetoRight {
  transform: translateX(-16px);
}
.animate.fadeOnly {
  filter: blur(5px);
}
.animateList > .box {
  opacity: 0;
  transition: all 2s ease 0s;
}
.animateList > .box.show {
  opacity: 1 !important;
  transform: none !important;
}
.animateList.fadeUpList > .box {
  transform: translateY(24px);
}
.animateList.fadetoLeftList > .box {
  transform: translateX(24px);
}




.table_box {
	margin: 0 auto;
	width: 100%;
}
.table_normal {
/*	width: 100%;*/
}

.table_normal tbody tr {
	border-bottom: 1px solid #cdcdcd;
}
.table_normal th {
	padding: 1.5rem 0rem 1.5rem 1rem;
	text-align: center;
	font-weight: bold;
	vertical-align: top;
}
.table_normal td {
	padding: 1.5rem 1rem 1.5rem 2rem;
}

@media (min-width: 992px) {
	.table_normal th {
		padding: 1.5rem 0rem 1.5rem 2rem;
	}
	.table_normal td {
		padding: 1.5rem 2rem 1.5rem 3rem;
	}
	}



/* ページネーション */

.pagination  {
	width: 100%;
	margin: 3rem 0 0;
  }
  
  .pagination ul {
	list-style: none !important;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	width: 100%;
	padding: 0;
  }
  
  .pagination li {
	margin: 0 5px 1.5rem;
  }
  
  .page-numbers {
	border: 1px solid var(--color-blue);
	padding: 10px 15px;
	text-decoration: none;
	color:  var(--color-blue) !important;
  }
  
  .page-numbers:hover {
	background-color:  var(--color-blue);
	  color: #fff !important;
  }
  
  .page-numbers.current {
	background-color:  var(--color-blue);
	  color: #fff !important;
	  border: 1px solid  var(--color-blue);
  }
  
  .pagination-total {
	text-align: center;
  }
  
  .prev_next_list {
	  border-top: 1px solid #ccc;
	  list-style: none !important;
    align-items: flex-start;
}

.prev_next_list li {
	display: flex;
	align-items: center;
}




.grecaptcha-badge { visibility: hidden; }
.movie-wrap {
	   position: relative;
	   padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
	   height: 0;
	   overflow: hidden;
  }
   
  .movie-wrap iframe {
	   position: absolute;
	   top: 0;
	   left: 0;
	   width: 100%;
	   height: 100%;
  }
  
@media screen and (min-width: 1200px){ 
.table_box {
	overflow-x: hidden;
	}
}


/* サービス一覧 （ホーム・下層共通）*/
.page-product__content ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0 5%;
}
.page-product__content ul li {
	flex-basis: 30%;
	background: #fff;
	border-radius: 1.5rem;
	box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
	margin-bottom: 3rem;
}
.page-product__content ul li a {
	text-decoration: none;
	display: flex;
	flex-direction: column;
}
.page-product__content ul li .product-pic {
	display: flex;
    justify-content: space-between;
	align-items: flex-start;
	flex-direction: column;
	border-radius: 1.5rem 1.5rem 0 0;
	overflow: hidden;
	background: #f5fbff;
	height: 230px;
}
.page-product__content ul li .product-logo {
	width: auto;
	height: 20px;
	max-width: none;
	object-fit: contain;
	margin: 1.5rem 0 0 1rem;
	vertical-align: middle;
}
.page-product__content ul li .product-thum {
	display: block;
	width: 82%;
	margin: 0 auto;
	box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
	transition: 0.5s;
}
.page-product__content ul li a:hover .product-thum {
	transform: translate(0px, -3px) scale(1.05);
}
.page-product__content ul li .product-txt {
	padding: 1rem 10% 2rem;
}
.page-product__content ul li .product-name {
	margin: 0 0 0.5rem;
	color: var(--color-main);
	font-size: 1.125rem;
	font-weight: 800;
}
.page-product__content ul li a:hover .product-name {
	color: var(--color-blue);
}
.page-product__content ul li .product-txt .txt {
	color: var(--color-main);
	font-size: 0.9rem;
	margin: 0;
}
.page-product__content ul li a:hover .product-txt .txt {
	color: var(--color-blue);
}

@media screen and (max-width: 768px) {

	.page-product__content ul {
		flex-direction: column;
	}	
}


/* ニュース（ホーム・下層共通） */
.news-list li {
	display: flex;
	padding: 1.5rem 1rem;
	border-bottom: 1px solid #ccc;
	justify-content: space-between;
}
.news-list li .news-date {
	flex-basis: 8%;
	font-size: 0.85rem;
	color: var(--color-main);
}
.news-list li a {
	text-decoration: none;
	font-size: 0.9rem;
	color: var(--color-main);
}
.news-list li .news-ctg {
	flex-basis: 15%;
	color: var(--color-blue);
	display: block;
	text-align: center;
	font-size: 0.75rem;
	font-weight: bold;
	letter-spacing: 0;
}
.news-list li .news-ttl {
	flex-basis: 75%;
	display: block;
	font-size: 0.9rem;
	color: var(--color-main);
}
 .news-list li .news-ttl:hover {
	color: var(--color-blue);
}

.ctg-list li .news-ttl {
	flex-basis: 85%;
}

@media screen and (max-width: 768px) {
	
	.news-list li {
		flex-direction: column;
	}
	.news-list li .news-ctg {
		position: relative;
		margin: -0.8rem 0 0.5rem 0;
		text-align: right;
	}
	
}