@charset "UTF-8";
/* CSS Document */
#download.download {
	width: 100%;
	overflow-x: hidden;
	height: auto;
}
#download .downloadPage {
	position: relative;
	display: block;
	z-index: 10;
	width: 100%;
	height: auto;
	padding-bottom: 18rem;
	margin-left: 39px;
}
#download #mv .mvt {
	margin-bottom: 24rem;
}
/* ~768px For SP 
=================================*/
@media screen and (max-width: 768px) {
		#download .downloadPage {
		height: auto;
		padding-bottom: 12rem;
		padding-right: 0;
		margin-left: 0;
	}
	#download #mv .mvt {
		margin-bottom: 12rem;
	}
}
/*common*/
#download {
	font-weight: 400;
	color: #212426;
	letter-spacing: 0.06rem;
}
#download a {
	color: #212426;
}
#download img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
}
#download .section {
	position: relative;
	display: block;
	width: 100%;
	padding-right: 78px;
	margin-top: 14.6rem;
}
#download .section__container {
	position: relative;
	width: 94.6rem;
	margin: 0 auto;
}
#download .regulationTitle {
	position: relative;
	display: block;
	width: 100%;
	padding-right: 78px;
}
#download .regulationTitle h2 {
	display: block;
	min-height: 6.4rem;
	width: 94.6rem;
	margin: 0 auto;
	font-weight: 900;
	font-size: 3.6rem;
	line-height: 3.6rem;
	letter-spacing: 0.04rem;
	border-bottom: 2px solid #EB5505;
}
#download .regulationTitle h2::before {
	content: "";
	display: block;
	width: 0;
	height: 0;
	margin-top: calc((3.6 - 3.6) * 0.5rem);
}
#download .regulationTitle h2::after {
	content: "";
	display: block;
	width: 0;
	height: 0;
	margin-bottom: calc((3.6 - 3.6) * 0.5rem);
}
#download .section__title {
	font-size: 2.6rem;
	line-height: 3.6rem;
	font-weight: 900;
	margin-bottom: 3rem;
	letter-spacing: 0.06rem;
}
/* ~768px For SP 
=================================*/
@media screen and (max-width: 768px) {
	/*common*/
	#download .section {
		padding-right: 0;
		margin-top: 6rem;
		padding: 0 3.2rem;
	}
	#download .section__container {
		width: 100%;;
	}
	#download .section__title {
		font-size: 1.8rem;
		line-height: 3rem;
		margin-bottom: 2.4rem;
	}
	#download .regulationTitle {
		width: 100%;
		padding: 0 3.2rem;
	}
	#download .regulationTitle h2 {
		min-height: 5rem;
		width: 100%;
		font-size: 2.8rem;
		line-height: 3.6rem;
		padding-bottom: 1.4rem;
	}
	#download .regulationTitle h2::before {
		content: "";
		display: block;
		width: 0;
		height: 0;
		margin-top: calc((2.8 - 3.6) * 0.5rem);
	}
	#download .regulationTitle h2::after {
		content: "";
		display: block;
		width: 0;
		height: 0;
		margin-bottom: calc((2.8 - 3.6) * 0.5rem);
	}
}
#download .brandLogo__btns .btn__nomal + .btn__nomal {
	margin-top: 2rem;
}
#download .brandLogo__btns {
	margin-bottom: 4rem;
}
#download .text__nomal {
	margin-bottom: 1.5rem;
}
/* ~768px For SP 
=================================*/
@media screen and (max-width: 768px) {
		#download .text__nomal {
		margin-bottom: 2rem;
	}
}
#download .textLink__nomal {
  position: relative;
  display: block;
  width: 100%;
  color: #212426;
  font-size: 1.5rem;
  line-height: 2.8rem;
  letter-spacing: 0.06rem;
}
#download .textLink__nomal a {
	position: relative;
  display: inline-block;
  color: #212426;
  font-size: 1.5rem;
  line-height: 2.8rem;
  letter-spacing: 0;
	overflow: hidden;
	padding-right: 1rem;
}
#download .textLink__nomal a::before {
	position: absolute;
	bottom: 2px;
	left: -100%;
	width: 200%;
	height: 1px;
	min-height: 1px;
	content: "";
	background-image: linear-gradient(to right, #212426, #212426 50%, transparent 50%, transparent);
	transition: left 0.3s ease-out;
}
#download .textLink__nomal a .linkIcon {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	padding-bottom: 1rem;
}
#download .textLink__nomal a .linkIcon::after {
	content: "";
	position: absolute;
	top: calc(50% - 0.6rem);
	left: 0.5rem;
	width: 0.5rem;
	height: 0.95rem;
	background-image: url(/brand/visual-identity/au/download/assets/image/icon_arrow_53edf73cb8516905.svg);
	background-repeat: no-repeat;
	background-size: 100% auto;
	pointer-events: none;
	box-sizing: border-box;
	transition: all 0.3s ease-out;
}
/* 768px~ For PConly 
=================================*/
@media screen and (min-width: 769px) {
	/*common*/
	#download .textLink__nomal a::before {
    position: absolute;
		content: "";
		width: 200%;
    height: 1px;
    bottom: 2px;
    left: -100%;
    min-height: 1px;
    background-image: linear-gradient(to right, #212426, #212426 50%, transparent 50%, transparent);
    transition: left 0.3s ease-out;
  }
  #download .textLink__nomal a:hover::before {
    left: 0%;
  }
}

/* ~768px For SP 
=================================*/
@media screen and (max-width: 768px) {
		#download .textLink__nomal a {
		font-size: 1.4rem;
		line-height: 2.6rem;
	}
}

#download .icon__employees {
	position: relative;
	padding-right: 8rem;
	display: inline-block;
}
#download .icon__employees:after {
	position: absolute;
	display: inline-flex;
	content: "社員向け";
	justify-content: center;
	align-items: center;
	top: calc(50% - 1.2rem);
	right: 0;
	width: 6rem;
	height: 2.4rem;
	background-color: #757678;
	color: #FFFFFF;
	font-weight: 400;
	font-size:1.2rem;
}

/* ~768px For SP 
=================================*/
@media screen and (max-width: 768px) {
		#download .icon__employees {
		padding-right: 6rem;
	}
	#download .icon__employees:after {
		top: calc(50% - 0.9rem);
		width: 4.8rem;
		height: 1.8rem;
		font-size: 1.0rem;
	}
}

#download .icon__recommended {
	position: relative;
}
#download .icon__recommended:after {
	position: absolute;
	display: inline-flex;
	content: "利用推奨";
	justify-content: center;
	align-items: center;
	top: 0.5rem;
	left: 0.5rem;
	width: 6rem;
	height: 2.2rem;
	border: 1px solid #EB5505;
	color: #EB5505;
	font-weight: 400;
	font-size:1.2rem;
	transition: all 0.3s ease-out;
}
/* 768px~ For PConly 
=================================*/
@media screen and (min-width: 769px) {
	#download .btn__logoDownload li:hover .icon__recommended::after {
		opacity: 0.5;
	}
}
/* ~768px For SP 
=================================*/
@media screen and (max-width: 768px) {
	#download .icon__recommended:after {
		top: 0.5rem;
		left: 0.5rem;
		width: 4.8rem;
		height: 1.8rem;
		font-size:1.0rem;
	}
}

#download .btn__nomal {
	position: relative;
	width: 100%;
	min-height: 6.4rem;
	border: 1px solid #212426;
	display: flex;
	justify-content: center;
	align-items: center;
}
#download .btn__nomal a {
 padding: 2rem;
}
#download .btn__nomal .linkText {
	color: #212426;
	font-weight: 700;
	font-size: 1.8rem;
	line-height: 3rem;
	letter-spacing: 0.06rem;
	transition: all 0.3s ease-out;
}
#download .btn__nomal .downloadText {
	color: #212426;
	font-weight: 700;
	font-size: 1.8rem;
	line-height: 3rem;
	letter-spacing: 0.06rem;
	transition: all 0.3s ease-out;
}
#download .btn__nomal .downloadIcon {
	position: absolute;
	top: 50%;
	right: 2.2rem;
	width: 1.2rem;
	height: 1.7rem;
	transform: translateY(-50%);
	display: inline-block;
}
#download .btn__nomal .downloadIcon::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 0.96rem;
	height: 1.2rem;
	background-image: url(/brand/visual-identity/au/download/assets/image/icon_download_arrow_44d1c328bca5112e.svg);
	background-repeat: no-repeat;
	background-size: 100% auto;
	pointer-events: none;
	box-sizing: border-box;
	transition: all 0.3s ease-out;
}
#download .btn__nomal .downloadIcon::after {
	content: "";
	position: absolute;
	top: 1.5rem;
	left: 0;
	width: 0.96rem;
	height: 1px;
	background-color: #EB5505;
}
#download .btn__nomal .linkIcon::after {
	content: "";
	position: absolute;
	top: calc(50% - 0.45rem);
	right: 2.5rem;
	width: 0.5rem;
	height: 0.95rem;
	background-image: url(/brand/visual-identity/au/download/assets/image/icon_arrow_53edf73cb8516905.svg);
	background-repeat: no-repeat;
	background-size: 100% auto;
	pointer-events: none;
	box-sizing: border-box;
	transition: all 0.3s ease-out;
}
#download .btn__nomal .newwindowIcon {
	position: absolute;
	top: calc(50% - 0.6rem);
	right: 2.5rem;
	width: 1.2rem;
	height: 1rem;
	display: inline-block;
	transition: all 0.3s ease-out;
}
#download .btn__nomal .newwindowIcon::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0.7rem;
	width: 0.8rem;
	height: 0.7rem;
	border: #EB5505 solid 1px;
	background-color: #fff;
	box-sizing: border-box;
	transition: all 0.3s ease-out;
}
#download .btn__nomal .newwindowIcon::before {
	content: "";
	position: absolute;
	top: 0.3rem;
	left: 0;
	width: 1.3rem;
	height: 1rem;
	border: #EB5505 solid 1px;
	background-color: #fff;
	box-sizing: border-box;
	transition: all 0.3s ease-out;
}
/* 769px~ For PConly 
=================================*/
@media screen and (min-width: 769px) {
	#download .btn__nomal:hover .linkText {
		color: #EB5505;
		transform: translate(0.5rem , 0)
	}
	#download .btn__nomal:hover .downloadText {
		color: #EB5505;
		transform: translate(0 , 0.25rem)
	}
	#download .btn__nomal:hover .linkIcon::after {
		right: 2.25rem;
	}
	#download .btn__nomal:hover .downloadIcon::before {
		top: 0.16rem;
	}
	#download .btn__nomal:hover .newwindowIcon::after {
		content: "";
		position: absolute;
		top: 0;
		left: 0.3rem;
		width: 1.2rem;
		height: 1rem;
		border: #EB5505 solid 1px;
		background-color: #fff;
		box-sizing: border-box;
	}
	#download .btn__nomal:hover .newwindowIcon::before {
		content: "";
		position: absolute;
		top: 0.7rem;
		left:0;
		width: 0.8rem;
		height: 0.6rem;
		border: #EB5505 solid 1px;
		background-color: #fff;
		box-sizing: border-box;
	}
}
/* ~768px For SP 
=================================*/
@media screen and (max-width: 768px) {
		#download .btn__nomal {
		padding: 0.5rem 4rem 0.5rem 2rem;
	}
	#download .btn__nomal .linkText {
		font-size: 1.5rem;
		line-height: 2.1rem;
		text-align: center
	}
	#download .btn__nomal .downloadText {
		font-size: 1.5rem;
		line-height: 2.1rem;
		text-align: center
	}
	#download .btn__nomal .downloadIcon {
		right: 1.5rem;
	}
	#download .btn__nomal .newwindowIcon {
		right: 1.5rem;
	}
	#download .btn__nomal .linkIcon::after {
		right: 1.8rem;
	}
	#download .btn__nomal .downloadIcon::after {
		top: 1.5rem;
	}
}

#download .btn__logoDownload li {
	border: 1px solid #EDEEEF;
}
#download .btn__logoDownload a {
	display: block;
	height: 100%;
}
#download .btn__logoDownload--img {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 23.4rem;
	padding: 2.5rem;
}
#download .btn__logoDownload--img img {
	transition: all 0.3s ease-out;
}
#download .btn__logoDownload--img.raphicDevice img {
	width: 33.6rem;
}
#download .btn__logoDownload--img.auSloganLogo img {
	width: 22.6rem;
}
#download .btn__logoDownload--img.auLogo img {
	width: 13.8rem;
}
#download .btn__logoDownload--img.auMotionLogo img {
	width: 22.6rem;
}
#download .btn__logoDownload--img.auBrandLogo img {
	width: 34.6rem;
}
#download .btn__logoDownload--img.respectYouLogo img {
	width: 37.7rem;
}
#download .btn__logoDown--inner {
	min-height: 8rem;
	position: relative;
	border-top: 1px solid #EDEEEF;
}
#download .btn__logoDownload--text {
	font-weight: 700;
	font-size: 1.5rem;
	transition: all 0.3s ease-out;
	position: absolute;
	top: calc(50% - 1.2rem);
	left: 2.5rem;
}
#download .btn__logoDownload--icon::before {
	content: "";
	position: absolute;
	top: calc(50% - 0.8rem);
	right: 2.6rem;
	width: 0.96rem;
	height: 1.2rem;
	background-image: url(/brand/visual-identity/au/download/assets/image/icon_download_arrow_44d1c328bca5112e.svg);
	background-repeat: no-repeat;
	background-size: 100% auto;
	pointer-events: none;
	box-sizing: border-box;
	transition: all 0.3s ease-out;
}
#download .btn__logoDownload--icon::after {
	content: "";
	position: absolute;
	top: calc(50% + 0.7rem);
	right: 2.6rem;
	width: 0.96rem;
	height: 1px;
	background-color: #EB5505;
}

/* 768px~ For PConly 
=================================*/
@media screen and (min-width: 769px) {
	#download .btn__logoDownload {
		display: flex;
		flex-wrap: wrap;
		margin-top: 4rem;
	}
	#download .btn__logoDownload li {
		display: block;
		width: calc(100% / 2 - 1.5rem);
		height: auto;
	}
	#download .btn__logoDownload li:nth-of-type(2n) {
		margin-left: 3rem;
	}
	#download .btn__logoDownload li:nth-of-type(n + 3) {
		margin-top: 3rem;
	}
	#download .btn__logoDownload a:hover img {
		opacity: 0.5;
	}
	#download .btn__logoDownload a:hover .btn__logoDownload--text {
		color: #EB5505;
		transform: translate(0 , 0.4rem)
	}
	#download .btn__logoDownload a:hover .btn__logoDownload--icon::before {
		top: calc(50% - 0.6rem);
	}
}

/* ~768px For SP 
=================================*/
@media screen and (max-width: 768px) {
	#download .btn__logoDownload {
		margin-top: 3rem;
	}
	#download .btn__logoDownload li:nth-of-type(n + 2) {
		margin-top: 2rem;
	}
	#download .btn__logoDownload--img {
		height: 15.7rem;
		padding: 1.5rem;
	}
	#download .btn__logoDownload--img img {
		transition: all 0.3s ease-out;
	}
	#download .btn__logoDownload--img.raphicDevice img {
		width: 22.6rem;
	}
	#download .btn__logoDownload--img.auSloganLogo img {
		width: 16.1rem;
	}
	#download .btn__logoDownload--img.auLogo img {
		width: 9.6rem;
	}
	#download .btn__logoDownload--img.auMotionLogo img {
		width: 16.1rem;
	}
	#download .btn__logoDownload--img.auBrandLogo img {
		width: 26.9rem;
	}
	#download .btn__logoDownload--img.respectYouLogo img {
		width: 25.8rem;
	}
	#download .btn__logoDownload--text {
		font-size: 1.4rem;
		line-height: 1.9rem;
		left: 1.5rem;
		max-width: 85%;
		
	}
	#download .btn__logoDownload--icon::before {
		right: 1.5rem;
	}
	#download .btn__logoDownload--icon::after {
		right: 1.5rem;
	}
}

/*downloadData*/
#downloadData {
	margin-top: 25rem;
}
#download h4.brandLogo__title {
	position: relative;
	font-size: 2rem;
	line-height: 3rem;
	font-weight: 900;
	margin-bottom: 3rem;
	margin-top: 1rem;
	padding-left: 2.3rem;
	letter-spacing: 0.06rem;
}
#download h4.brandLogo__title:before {
	position: absolute;
	top: 1rem;
	left: 0;
	content: "";
	width: 0.8rem;
	height: 0.8rem;
	background-color: #DDDFE2;
	border-radius: 50%;
	text-align: center;
}
/* ~768px For SP 
=================================*/
@media screen and (max-width: 768px) {
	#downloadData {
		margin-top: 16rem;
	}
	#download .brandLogo__btns {
		margin-bottom: 3rem;
	}
	#download h4.brandLogo__title {
		font-size: 1.6rem;
		margin-bottom: 2rem;
		padding-left: 1.6rem;;
	}
}

/*relatedInfo*/
#download #relatedInfo {
	position: relative;
	display: block;
	width: 100%;
	padding-right: 78px;
	margin-top: 12rem;
}
#download .relatedInfo__container {
	position: relative;
	width: 94.6rem;
	margin: 0 auto;
	border-top: 1px solid #edeeef;
	padding-top: 12rem;
}
#download h2.relatedInfo__title {
	font-size: 2.6rem;
	line-height: 3.6rem;
	font-weight: 900;
	margin-bottom: 3rem;
	letter-spacing: 0.06rem;
}
#download h3.relatedInfo__title {
	position: relative;
	font-size: 2rem;
	line-height: 3rem;
	font-weight: 900;
	margin-bottom: 4rem;
	padding-left: 2.3rem;
	letter-spacing: 0.06rem;
}
#download h3.relatedInfo__title:before {
	position: absolute;
	top: 1rem;
	left: 0;
	content: "";
	width: 0.8rem;
	height: 0.8rem;
	background-color: #DDDFE2;
	border-radius: 50%;
	text-align: center;
}
#download .relatedInfo__text {
	padding-left: 2rem;
}

/* ~768px For SP 
=================================*/
@media screen and (max-width: 768px) {
	#download #relatedInfo {
		padding-right: 0;
		margin-top: 10rem;
	}
	#download .relatedInfo__container{
		width: 100%;;
		margin: 0 auto;
		padding: 0 3.2rem;
		border-top:none;
	}
	#download h2.relatedInfo__title {
		font-size: 1.8rem;
	}
	#download h3.relatedInfo__title {
		font-size: 1.6rem;
		margin-bottom: 2rem;
		padding-left: 1.6rem;;
	}
	#download .relatedInfo__text {
		padding-left: 1.6rem;
	}
}