{"version":3,"sources":["webpack://src/css/works.css","webpack://src/css/filter.css","webpack://src/css/proCon.css","webpack://src/css/load.css","webpack://src/css/title.css"],"names":[],"mappings":"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","file":"14.fe7eba59.chunk.css","sourcesContent":["@font-face {\n  font-family: \"OpenM\";\n  src: url(\"../fonts/FbTipograf-Black.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"OpenL\";\n  src: url(\"../fonts/FbTipograf-Light.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"OpenR\";\n  src: url(\"../fonts/FbTipograf-Regular.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"OpenB\";\n  src: url(\"../fonts/FbTipograf-Bold.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Credit\";\n  src: url(\"../fonts/NotoSansJP-Medium.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"CreditL\";\n  src: url(\"../fonts/Heebo-Light.ttf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"CreditB\";\n  src: url(\"../fonts/NotoSansJP-Black.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Num_1\";\n  src: url(\"../fonts/number_1.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Num_2\";\n  src: url(\"../fonts/number_2.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n* {\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n}\n\nbody, .App {\n  position: relative;\n  height: 100vh;\n  direction: RTL;\n  width: 100%;\n  background-color: white;\n}\n\nbody > main, .App > main {\n  position: relative;\n  z-index: 0;\n  font-family: 'OpenL';\n  margin: 0;\n  width: 100%;\n}\n\nbody a, .App a {\n  text-decoration: none;\n  color: black;\n}\n\n.fa-trash-alt {\n  cursor: pointer;\n}\n\n/* Safari */\n@-webkit-keyframes spin {\n  0% {\n    -webkit-transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform: rotate(360deg);\n  }\n}\n\n@keyframes spin {\n  0% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform: rotate(360deg);\n            transform: rotate(360deg);\n  }\n}\n\n/* Safari */\n@-webkit-keyframes leftSlide {\n  0% {\n    opacity: 0;\n    left: 100%;\n  }\n  100% {\n    opacity: 1;\n    left: 0%;\n  }\n}\n\n@keyframes leftSlide {\n  0% {\n    opacity: 0;\n    left: 100%;\n  }\n  100% {\n    opacity: 1;\n    left: 0%;\n  }\n}\n\n/* Safari */\n@-webkit-keyframes shake {\n  0% {\n    -webkit-transform: rotate(10deg);\n            transform: rotate(10deg);\n  }\n  25% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  50% {\n    -webkit-transform: rotate(-10deg);\n            transform: rotate(-10deg);\n  }\n  75% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform: rotate(10deg);\n            transform: rotate(10deg);\n  }\n}\n\n@keyframes shake {\n  0% {\n    -webkit-transform: rotate(10deg);\n            transform: rotate(10deg);\n  }\n  25% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  50% {\n    -webkit-transform: rotate(-10deg);\n            transform: rotate(-10deg);\n  }\n  75% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform: rotate(10deg);\n            transform: rotate(10deg);\n  }\n}\n\n.works {\n  position: relative;\n  margin: 0 auto;\n  padding: 0;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: row;\n          flex-direction: row;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  text-align: center;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  -ms-flex-wrap: wrap;\n      flex-wrap: wrap;\n  width: 100%;\n}\n\n.works > .social_view {\n  position: fixed;\n  top: 0;\n  right: 0;\n  width: 100%;\n  z-index: 999999;\n  height: 100vh;\n  opacity: 0;\n  -webkit-transition: all 0.25s ease-in-out;\n  transition: all 0.25s ease-in-out;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: row;\n          flex-direction: row;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  text-align: center;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  overflow: hidden;\n}\n\n@media (max-width: 1000px) {\n  .works > .social_view {\n    -webkit-box-align: start;\n        -ms-flex-align: start;\n            align-items: flex-start;\n    overflow-y: scroll;\n  }\n}\n\n.works > .social_view.open {\n  opacity: 1;\n}\n\n.works > .social_view > .bg {\n  position: fixed;\n  width: 100%;\n  height: 100%;\n  background-color: rgba(0, 0, 0, 0.8);\n  cursor: pointer;\n}\n\n.works > .social_view > .item_con {\n  position: relative;\n  width: 40%;\n  z-index: 1;\n  background-color: transparent;\n  padding: 1rem;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: vertical;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: column;\n          flex-direction: column;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  text-align: center;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n}\n\n@media (max-width: 1000px) {\n  .works > .social_view > .item_con {\n    width: 100%;\n    padding: 0rem;\n  }\n}\n\n.works > .social_view > .item_con > .close_con {\n  position: absolute;\n  right: 1.5rem;\n  top: 0.5rem;\n  font-family: 'credit';\n  z-index: 1;\n  font-size: 2rem;\n  color: white;\n  cursor: pointer;\n}\n\n@media (max-width: 1000px) {\n  .works > .social_view > .item_con > .close_con {\n    position: fixed;\n  }\n}\n\n.works > .social_view > .item_con > .name {\n  position: relative;\n  font-size: 2.25rem;\n  text-decoration: underline;\n}\n\n.works > .social_view > .item_con > .img_con {\n  position: relative;\n  width: 100%;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: row;\n          flex-direction: row;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  text-align: center;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n}\n\n.works > .social_view > .item_con > .img_con > img {\n  position: relative;\n  width: 100%;\n}\n\n.works > .viedo_view {\n  position: fixed;\n  top: 0;\n  right: 0;\n  width: 100%;\n  z-index: 9999;\n  height: 100vh;\n  opacity: 0;\n  -webkit-transition: all 0.25s ease-in-out;\n  transition: all 0.25s ease-in-out;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: row;\n          flex-direction: row;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  text-align: center;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  overflow: hidden;\n}\n\n.works > .viedo_view.long > .item_con {\n  position: absolute;\n  -webkit-transform: rotate(0deg);\n          transform: rotate(0deg);\n  width: 50%;\n  height: 60vh;\n}\n\n.works > .viedo_view.long.landscape {\n  -webkit-transform: rotate(0deg);\n          transform: rotate(0deg);\n  width: 100%;\n  height: 100vh;\n  right: 0;\n}\n\n.works > .viedo_view.long.landscape > .item_con {\n  position: absolute;\n  -webkit-transform: rotate(0deg);\n          transform: rotate(0deg);\n  width: 100%;\n  height: 100vh;\n}\n\n@media (max-width: 1000px) {\n  .works > .viedo_view {\n    z-index: 9999999;\n  }\n  .works > .viedo_view.landscape {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n    width: 100%;\n    height: 100vh;\n    right: 0;\n  }\n  .works > .viedo_view.landscape > .item_con {\n    position: absolute;\n    -webkit-transform: rotate(-90deg);\n            transform: rotate(-90deg);\n    width: 100vh;\n    height: 100vw;\n  }\n}\n\n.works > .viedo_view.open {\n  opacity: 1;\n}\n\n.works > .viedo_view > .bg {\n  position: fixed;\n  width: 100%;\n  height: 100%;\n  background-color: rgba(0, 0, 0, 0.8);\n  cursor: pointer;\n}\n\n.works > .viedo_view > .item_con {\n  position: relative;\n  width: 45%;\n  height: 50vh;\n  z-index: 1;\n  background-color: black;\n  color: white;\n  padding: 1rem;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: row;\n          flex-direction: row;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  text-align: center;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n}\n\n@media (max-width: 1000px) {\n  .works > .viedo_view > .item_con {\n    width: 100%;\n    height: 100%;\n  }\n}\n\n.works > .viedo_view > .item_con > .close_con {\n  position: absolute;\n  right: 0rem;\n  top: 0rem;\n  font-family: 'credit';\n  z-index: 1;\n  width: 3rem;\n  height: 3rem;\n  font-size: 1.75rem;\n  background-color: rgba(0, 0, 0, 0.8);\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: row;\n          flex-direction: row;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  text-align: center;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  -webkit-box-align: start;\n      -ms-flex-align: start;\n          align-items: flex-start;\n  color: white;\n  cursor: pointer;\n}\n\n.works > .viedo_view > .item_con > .name {\n  position: absolute;\n  font-size: 2rem;\n  color: rgba(237, 237, 237, 0.8);\n  top: 0;\n  left: 0;\n  z-index: 1;\n  background-color: rgba(0, 0, 0, 0.8);\n  padding: 0.25rem 1rem;\n}\n\n.works > .viedo_view > .item_con > .name::before {\n  position: absolute;\n  content: '';\n  width: 0.5rem;\n  height: 100%;\n  top: 0;\n  background: rgba(0, 0, 0, 0.8);\n  right: -0.75rem;\n}\n\n.works > .viedo_view > .item_con > video {\n  position: absolute;\n  top: 0%;\n  left: 0%;\n  width: 100%;\n  height: 100%;\n}\n\n.pros_con {\n  position: relative;\n  width: calc(85% + 30px);\n  height: auto;\n  margin: 0rem auto;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: row;\n          flex-direction: row;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  text-align: center;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  -ms-flex-wrap: wrap;\n      flex-wrap: wrap;\n  padding: 2rem 0;\n}\n\n@media (max-width: 1000px) {\n  .pros_con {\n    width: 98%;\n  }\n}\n","@font-face {\n  font-family: \"OpenM\";\n  src: url(\"../fonts/FbTipograf-Black.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"OpenL\";\n  src: url(\"../fonts/FbTipograf-Light.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"OpenR\";\n  src: url(\"../fonts/FbTipograf-Regular.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"OpenB\";\n  src: url(\"../fonts/FbTipograf-Bold.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Credit\";\n  src: url(\"../fonts/NotoSansJP-Medium.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"CreditL\";\n  src: url(\"../fonts/Heebo-Light.ttf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"CreditB\";\n  src: url(\"../fonts/NotoSansJP-Black.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Num_1\";\n  src: url(\"../fonts/number_1.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Num_2\";\n  src: url(\"../fonts/number_2.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n* {\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n}\n\nbody, .App {\n  position: relative;\n  height: 100vh;\n  direction: RTL;\n  width: 100%;\n  background-color: white;\n}\n\nbody > main, .App > main {\n  position: relative;\n  z-index: 0;\n  font-family: 'OpenL';\n  margin: 0;\n  width: 100%;\n}\n\nbody a, .App a {\n  text-decoration: none;\n  color: black;\n}\n\n.fa-trash-alt {\n  cursor: pointer;\n}\n\n/* Safari */\n@-webkit-keyframes spin {\n  0% {\n    -webkit-transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform: rotate(360deg);\n  }\n}\n\n@keyframes spin {\n  0% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform: rotate(360deg);\n            transform: rotate(360deg);\n  }\n}\n\n/* Safari */\n@-webkit-keyframes leftSlide {\n  0% {\n    opacity: 0;\n    left: 100%;\n  }\n  100% {\n    opacity: 1;\n    left: 0%;\n  }\n}\n\n@keyframes leftSlide {\n  0% {\n    opacity: 0;\n    left: 100%;\n  }\n  100% {\n    opacity: 1;\n    left: 0%;\n  }\n}\n\n/* Safari */\n@-webkit-keyframes shake {\n  0% {\n    -webkit-transform: rotate(10deg);\n            transform: rotate(10deg);\n  }\n  25% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  50% {\n    -webkit-transform: rotate(-10deg);\n            transform: rotate(-10deg);\n  }\n  75% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform: rotate(10deg);\n            transform: rotate(10deg);\n  }\n}\n\n@keyframes shake {\n  0% {\n    -webkit-transform: rotate(10deg);\n            transform: rotate(10deg);\n  }\n  25% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  50% {\n    -webkit-transform: rotate(-10deg);\n            transform: rotate(-10deg);\n  }\n  75% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform: rotate(10deg);\n            transform: rotate(10deg);\n  }\n}\n\n.campaginFilter {\n  position: -webkit-sticky;\n  position: sticky;\n  top: 3rem;\n  width: 100%;\n  padding: 0.5rem 11%;\n  margin: 2rem auto;\n  background-color: white;\n  z-index: 2;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: row;\n          flex-direction: row;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  text-align: center;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  -webkit-box-pack: start;\n      -ms-flex-pack: start;\n          justify-content: flex-start;\n  font-size: 1rem;\n}\n\n@media (max-width: 1000px) {\n  .campaginFilter {\n    width: 100%;\n    padding: 5% 8.5%;\n    height: auto;\n    margin: 0;\n    overflow-y: scroll;\n    scrollbar-width: none;\n  }\n}\n\n.campaginFilter > .filter {\n  margin: 0 0 0 2rem;\n  cursor: pointer;\n}\n\n@media (max-width: 1000px) {\n  .campaginFilter > .filter {\n    margin: 0 0 0 1rem;\n  }\n}\n\n.campaginFilter > .selected {\n  font-family: 'OpenB';\n  font-weight: bolder;\n}\n","@font-face {\n  font-family: \"OpenM\";\n  src: url(\"../fonts/FbTipograf-Black.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"OpenL\";\n  src: url(\"../fonts/FbTipograf-Light.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"OpenR\";\n  src: url(\"../fonts/FbTipograf-Regular.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"OpenB\";\n  src: url(\"../fonts/FbTipograf-Bold.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Credit\";\n  src: url(\"../fonts/NotoSansJP-Medium.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"CreditL\";\n  src: url(\"../fonts/Heebo-Light.ttf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"CreditB\";\n  src: url(\"../fonts/NotoSansJP-Black.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Num_1\";\n  src: url(\"../fonts/number_1.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Num_2\";\n  src: url(\"../fonts/number_2.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n* {\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n}\n\nbody, .App {\n  position: relative;\n  height: 100vh;\n  direction: RTL;\n  width: 100%;\n  background-color: white;\n}\n\nbody > main, .App > main {\n  position: relative;\n  z-index: 0;\n  font-family: 'OpenL';\n  margin: 0;\n  width: 100%;\n}\n\nbody a, .App a {\n  text-decoration: none;\n  color: black;\n}\n\n.fa-trash-alt {\n  cursor: pointer;\n}\n\n/* Safari */\n@-webkit-keyframes spin {\n  0% {\n    -webkit-transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform: rotate(360deg);\n  }\n}\n\n@keyframes spin {\n  0% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform: rotate(360deg);\n            transform: rotate(360deg);\n  }\n}\n\n/* Safari */\n@-webkit-keyframes leftSlide {\n  0% {\n    opacity: 0;\n    left: 100%;\n  }\n  100% {\n    opacity: 1;\n    left: 0%;\n  }\n}\n\n@keyframes leftSlide {\n  0% {\n    opacity: 0;\n    left: 100%;\n  }\n  100% {\n    opacity: 1;\n    left: 0%;\n  }\n}\n\n/* Safari */\n@-webkit-keyframes shake {\n  0% {\n    -webkit-transform: rotate(10deg);\n            transform: rotate(10deg);\n  }\n  25% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  50% {\n    -webkit-transform: rotate(-10deg);\n            transform: rotate(-10deg);\n  }\n  75% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform: rotate(10deg);\n            transform: rotate(10deg);\n  }\n}\n\n@keyframes shake {\n  0% {\n    -webkit-transform: rotate(10deg);\n            transform: rotate(10deg);\n  }\n  25% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  50% {\n    -webkit-transform: rotate(-10deg);\n            transform: rotate(-10deg);\n  }\n  75% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform: rotate(10deg);\n            transform: rotate(10deg);\n  }\n}\n\n.pro_con {\n  position: relative;\n  width: 500px;\n  height: 500px;\n  margin: 10px;\n  overflow: hidden;\n  background: black;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: row;\n          flex-direction: row;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  text-align: center;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n}\n\n@media (max-width: 1750px) {\n  .pro_con {\n    width: 380px;\n    height: 380px;\n  }\n}\n\n@media (max-width: 1350px) {\n  .pro_con {\n    width: 325px;\n    height: 325px;\n  }\n}\n\n@media (max-width: 1150px) {\n  .pro_con {\n    width: 250px;\n    height: 250px;\n  }\n}\n\n@media (max-width: 1000px) {\n  .pro_con {\n    width: 100%;\n    height: 25rem;\n    margin: 10px 5px;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    text-align: center;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n  }\n}\n\n.pro_con > .loader {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  z-index: 0;\n  -webkit-transition: all 0.5s ease-in-out;\n  transition: all 0.5s ease-in-out;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: vertical;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: column;\n          flex-direction: column;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  text-align: center;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  background-color: black;\n  right: 0;\n  top: 0;\n}\n\n.pro_con > .loader.dLoad {\n  background-color: transparent;\n  opacity: 0;\n}\n\n.pro_con > .loader.dLoad > .loader {\n  -webkit-animation: spin 0s linear infinite;\n  /* Safari */\n  animation: spin 0s linear infinite;\n  -webkit-transition: all 0.5s ease-in-out;\n  transition: all 0.5s ease-in-out;\n}\n\n.pro_con > .loader > .BC {\n  position: relative;\n  width: 100%;\n  min-height: 4.5rem;\n  fill: white;\n  font-style: italic;\n  font-size: 4.5rem;\n  font-family: 'CreditB';\n}\n\n.pro_con > .loader > .BC > svg {\n  position: relative;\n  min-height: 4.5rem;\n  min-width: 4.5rem;\n}\n\n.pro_con > .loader > .loader_Body {\n  position: relative;\n  width: 100%;\n  height: auto;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: row;\n          flex-direction: row;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  text-align: center;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n}\n\n.pro_con > .loader > .loader_Body > .loader {\n  position: relative;\n  width: 15px;\n  height: 15px;\n  margin: 0rem;\n  opacity: 1;\n  -webkit-transition: all 0.25s ease-in-out;\n  transition: all 0.25s ease-in-out;\n}\n\n.pro_con > .loader > .loader_Body > .loader > .cir_1 {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, rgba(237, 237, 237, 0.8)), color-stop(50%, #ffffff00));\n  background: linear-gradient(rgba(237, 237, 237, 0.8) 50%, #ffffff00 50%);\n  -webkit-animation: spin 0.5s linear infinite;\n  /* Safari */\n  animation: spin 0.5s linear infinite;\n  border-radius: 100%;\n}\n\n.pro_con > .loader > .loader_Body > .loader > .cir_2 {\n  position: absolute;\n  top: 10%;\n  right: 10%;\n  width: 80%;\n  height: 80%;\n  background: black;\n  border-radius: 100%;\n}\n\n.pro_con > .loader > .loader_Body > .text {\n  position: relative;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: row;\n          flex-direction: row;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  text-align: center;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  width: auto;\n  height: auto;\n  color: white;\n  font-size: 1.5rem;\n  font-family: 'OpenB';\n  margin: 0 1rem;\n}\n\n.pro_con > .info_con {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  top: 0;\n  right: 0;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: vertical;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: column;\n          flex-direction: column;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  text-align: center;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  background-color: rgba(0, 0, 0, 0.8);\n  opacity: 0;\n  -webkit-transition: all 0.25s ease-in-out;\n  transition: all 0.25s ease-in-out;\n  z-index: 1;\n  direction: rtl;\n  overflow: hidden;\n}\n\n.pro_con > .info_con div {\n  color: white;\n}\n\n@media (max-width: 1000px) {\n  .pro_con > .info_con div {\n    color: #BCEBDD;\n  }\n}\n\n.pro_con > .info_con:hover {\n  opacity: 1;\n}\n\n.pro_con > .info_con:hover + .img_con {\n  height: 120%;\n  min-width: 120%;\n}\n\n@media (max-width: 1000px) {\n  .pro_con > .info_con {\n    position: absolute;\n    opacity: 1;\n    top: 0;\n    right: 0;\n    width: 100%;\n    height: 100%;\n    z-index: 1;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n            flex-direction: row;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    text-align: center;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-align: end;\n        -ms-flex-align: end;\n            align-items: flex-end;\n    background-color: transparent;\n  }\n  .pro_con > .info_con:hover + span > img {\n    height: 100%;\n    top: 0%;\n  }\n}\n\n.pro_con > .info_con > .more {\n  position: relative;\n  width: 100%;\n  height: 6rem;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: vertical;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: column;\n          flex-direction: column;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  text-align: center;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n}\n\n@media (max-width: 1000px) {\n  .pro_con > .info_con > .more {\n    -webkit-box-align: start;\n        -ms-flex-align: start;\n            align-items: flex-start;\n    cursor: pointer;\n    background-color: whitesmoke;\n    padding: 1rem 0.5rem;\n    display: none;\n  }\n}\n\n.pro_con > .info_con > .more > .name {\n  position: relative;\n  width: 100%;\n  font-size: 2rem;\n  font-weight: bolder;\n  text-align: center;\n}\n\n@media (max-width: 1000px) {\n  .pro_con > .info_con > .more > .name {\n    width: 100%;\n    text-align: right;\n    color: black;\n  }\n}\n\n.pro_con > .info_con > .more > .info {\n  width: 100%;\n  text-align: center;\n  font-size: 2rem;\n}\n\n@media (max-width: 1000px) {\n  .pro_con > .info_con > .more > .info {\n    position: relative;\n    bottom: 0;\n    left: 0;\n    font-size: 1.25rem;\n    color: #BCEBDD;\n    background-color: black;\n    width: auto;\n    padding: 0.5rem 0.25rem;\n  }\n}\n\n.pro_con > .info_con > .social_con {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  cursor: pointer;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: row;\n          flex-direction: row;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  text-align: center;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n}\n\n.pro_con > .info_con > .social_con > .name {\n  font-size: 2.25rem;\n}\n\n.pro_con > .img_con {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  top: 0px;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: row;\n          flex-direction: row;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  text-align: center;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  -webkit-transition: all 0.25s ease-in-out;\n  transition: all 0.25s ease-in-out;\n}\n\n@media (max-width: 1000px) {\n  .pro_con > .img_con {\n    min-width: 100%;\n    min-height: 25rem;\n  }\n}\n\n.pro_con > .img_con > span {\n  position: relative;\n  height: 100%;\n}\n\n.pro_con > .img_con > span > img {\n  position: relative;\n  height: 100%;\n  min-width: 100%;\n}\n\n@media (max-width: 1000px) {\n  .pro_con > .img_con > span > img {\n    min-height: 25rem;\n    min-width: 100%;\n  }\n}\n\n.pro_con.long > .info_con:hover + span > img {\n  height: 200%;\n  top: -50%;\n}\n\n.pro_con.long > .img_con {\n  position: relative;\n}\n\n.pro_con.long > .img_con > span {\n  position: relative;\n  height: 100%;\n}\n\n@media (max-width: 1000px) {\n  .pro_con.long > .img_con > span {\n    height: 350px;\n  }\n}\n\n.pro_con.long > .img_con > span > img {\n  position: relative;\n  min-height: 180%;\n  top: -35%;\n}\n\n@media (max-width: 1000px) {\n  .pro_con.long > .img_con > span > img {\n    height: 200%;\n  }\n}\n","@font-face {\n  font-family: \"OpenM\";\n  src: url(\"../fonts/FbTipograf-Black.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"OpenL\";\n  src: url(\"../fonts/FbTipograf-Light.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"OpenR\";\n  src: url(\"../fonts/FbTipograf-Regular.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"OpenB\";\n  src: url(\"../fonts/FbTipograf-Bold.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Credit\";\n  src: url(\"../fonts/NotoSansJP-Medium.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"CreditL\";\n  src: url(\"../fonts/Heebo-Light.ttf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"CreditB\";\n  src: url(\"../fonts/NotoSansJP-Black.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Num_1\";\n  src: url(\"../fonts/number_1.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Num_2\";\n  src: url(\"../fonts/number_2.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n* {\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n}\n\nbody, .App {\n  position: relative;\n  height: 100vh;\n  direction: RTL;\n  width: 100%;\n  background-color: white;\n}\n\nbody > main, .App > main {\n  position: relative;\n  z-index: 0;\n  font-family: 'OpenL';\n  margin: 0;\n  width: 100%;\n}\n\nbody a, .App a {\n  text-decoration: none;\n  color: black;\n}\n\n.fa-trash-alt {\n  cursor: pointer;\n}\n\n/* Safari */\n@-webkit-keyframes spin {\n  0% {\n    -webkit-transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform: rotate(360deg);\n  }\n}\n\n@keyframes spin {\n  0% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform: rotate(360deg);\n            transform: rotate(360deg);\n  }\n}\n\n/* Safari */\n@-webkit-keyframes leftSlide {\n  0% {\n    opacity: 0;\n    left: 100%;\n  }\n  100% {\n    opacity: 1;\n    left: 0%;\n  }\n}\n\n@keyframes leftSlide {\n  0% {\n    opacity: 0;\n    left: 100%;\n  }\n  100% {\n    opacity: 1;\n    left: 0%;\n  }\n}\n\n/* Safari */\n@-webkit-keyframes shake {\n  0% {\n    -webkit-transform: rotate(10deg);\n            transform: rotate(10deg);\n  }\n  25% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  50% {\n    -webkit-transform: rotate(-10deg);\n            transform: rotate(-10deg);\n  }\n  75% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform: rotate(10deg);\n            transform: rotate(10deg);\n  }\n}\n\n@keyframes shake {\n  0% {\n    -webkit-transform: rotate(10deg);\n            transform: rotate(10deg);\n  }\n  25% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  50% {\n    -webkit-transform: rotate(-10deg);\n            transform: rotate(-10deg);\n  }\n  75% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform: rotate(10deg);\n            transform: rotate(10deg);\n  }\n}\n\n@font-face {\n  font-family: \"OpenM\";\n  src: url(\"../fonts/FbTipograf-Black.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"OpenL\";\n  src: url(\"../fonts/FbTipograf-Light.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"OpenR\";\n  src: url(\"../fonts/FbTipograf-Regular.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"OpenB\";\n  src: url(\"../fonts/FbTipograf-Bold.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Credit\";\n  src: url(\"../fonts/NotoSansJP-Medium.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"CreditL\";\n  src: url(\"../fonts/Heebo-Light.ttf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"CreditB\";\n  src: url(\"../fonts/NotoSansJP-Black.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Num_1\";\n  src: url(\"../fonts/number_1.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Num_2\";\n  src: url(\"../fonts/number_2.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n.LoadCon {\n  position: relative;\n  width: 100%;\n  height: 2rem;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: row;\n          flex-direction: row;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  text-align: center;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n}\n\n.LoadCon > .Loader {\n  font-size: 1rem;\n  width: 50%;\n  height: 100%;\n}\n\n.LoadCon > .Loader > .Loader_circle {\n  position: relative;\n  border: 0.15rem solid transparent;\n  border-radius: 50%;\n  border-top: 0.15rem solid black;\n  width: 1rem;\n  height: 1rem;\n  margin: 0 auto;\n  -webkit-animation: spin 1.5s linear infinite;\n  /* Safari */\n  animation: spin 1.5s linear infinite;\n}\n","@font-face {\n  font-family: \"OpenM\";\n  src: url(\"../fonts/FbTipograf-Black.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"OpenL\";\n  src: url(\"../fonts/FbTipograf-Light.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"OpenR\";\n  src: url(\"../fonts/FbTipograf-Regular.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"OpenB\";\n  src: url(\"../fonts/FbTipograf-Bold.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Credit\";\n  src: url(\"../fonts/NotoSansJP-Medium.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"CreditL\";\n  src: url(\"../fonts/Heebo-Light.ttf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"CreditB\";\n  src: url(\"../fonts/NotoSansJP-Black.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Num_1\";\n  src: url(\"../fonts/number_1.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Num_2\";\n  src: url(\"../fonts/number_2.otf\") format(\"opentype\");\n  /* here you go, IE */\n  font-weight: normal;\n  font-style: normal;\n}\n\n* {\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n}\n\nbody, .App {\n  position: relative;\n  height: 100vh;\n  direction: RTL;\n  width: 100%;\n  background-color: white;\n}\n\nbody > main, .App > main {\n  position: relative;\n  z-index: 0;\n  font-family: 'OpenL';\n  margin: 0;\n  width: 100%;\n}\n\nbody a, .App a {\n  text-decoration: none;\n  color: black;\n}\n\n.fa-trash-alt {\n  cursor: pointer;\n}\n\n/* Safari */\n@-webkit-keyframes spin {\n  0% {\n    -webkit-transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform: rotate(360deg);\n  }\n}\n\n@keyframes spin {\n  0% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform: rotate(360deg);\n            transform: rotate(360deg);\n  }\n}\n\n/* Safari */\n@-webkit-keyframes leftSlide {\n  0% {\n    opacity: 0;\n    left: 100%;\n  }\n  100% {\n    opacity: 1;\n    left: 0%;\n  }\n}\n\n@keyframes leftSlide {\n  0% {\n    opacity: 0;\n    left: 100%;\n  }\n  100% {\n    opacity: 1;\n    left: 0%;\n  }\n}\n\n/* Safari */\n@-webkit-keyframes shake {\n  0% {\n    -webkit-transform: rotate(10deg);\n            transform: rotate(10deg);\n  }\n  25% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  50% {\n    -webkit-transform: rotate(-10deg);\n            transform: rotate(-10deg);\n  }\n  75% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform: rotate(10deg);\n            transform: rotate(10deg);\n  }\n}\n\n@keyframes shake {\n  0% {\n    -webkit-transform: rotate(10deg);\n            transform: rotate(10deg);\n  }\n  25% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  50% {\n    -webkit-transform: rotate(-10deg);\n            transform: rotate(-10deg);\n  }\n  75% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform: rotate(10deg);\n            transform: rotate(10deg);\n  }\n}\n\n.title_con {\n  position: relative;\n  width: 80%;\n  background-color: whitesmoke;\n  margin: 2rem auto;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: vertical;\n  -webkit-box-direction: normal;\n      -ms-flex-direction: column;\n          flex-direction: column;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center;\n  text-align: center;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  -webkit-box-align: start;\n      -ms-flex-align: start;\n          align-items: flex-start;\n  padding: 1.5rem 1.5rem;\n}\n\n.title_con.true {\n  margin: 0rem auto 1.5rem;\n}\n\n@media (max-width: 1000px) {\n  .title_con {\n    width: 100%;\n  }\n}\n\n.title_con > .heb {\n  font-family: 'OpenB';\n  font-size: 2rem;\n}\n\n.title_con > .eng {\n  font-family: 'credit';\n  font-style: italic;\n  font-weight: Bolder;\n  letter-spacing: -0.5rem;\n  letter-spacing: 0;\n  font-size: 1rem;\n  font-weight: lighter;\n}\n\n.title_con > .text {\n  position: relative;\n  width: 90%;\n  margin: 0 auto;\n  text-align: right;\n  text-align-last: right;\n  margin: 0.5rem 0;\n  font-size: 1.25rem;\n  line-height: 1.75rem;\n}\n"]}